2

I have multiple partial view on my single view page. Partial views load dynamically. And I want partial views load 1 by 1. Is it possible to do so?

IT_INFOhUb
  • 516
  • 8
  • 21
  • 40

2 Answers2

4

In you View, keep three Divs and assign the Url details in some attribute like below.

Sample HTML

<div id="Div1" attr-Url="@Url.Action("ActionName", "ControllerName", 
                                                    new { area = "Area Name" })">
</div>

<div id="Div2" attr-Url="@Url.Action("ActionName", "ControllerName", 
                                                    new { area = "Area Name" })">
</div>

<div id="Div3" attr-Url="@Url.Action("ActionName", "ControllerName", 
                                                    new { area = "Area Name" })">
</div>

Now, you can use Success CallBack of Load Event.

JQuery

$(document).ready(function () {
    var url = $('Div1').attr('attr-Url');
    $('Div1').load(url, function () {

        //Success callback
        url = $('Div2').attr('attr-Url2');
        $('Div2').load(url, function () {

            //Success callback
            url = $('Div3').attr('attr-Url3');
            $('Div3').load(url, function () {

                //Success callback
            }); 
        });
    });
});

If you notice the above code. Once the first partial view is loaded successfully, Second Partial View starts to load and sequentially third.

Hope this will help you...

1

This approach may be of use to you:

Render Partial Views using JQuery in MVC3

It uses jquery and .load(), to call an action that renders your partial view as html and returns it to the javascript, that you'd later place wherever you desire.

UPDATE:

If you want to load them in a sequence, one after the other, you can use the complete callback of jquery's load() to chain one after the other.

If you want to have them load at specific times or intervals, you can use javascript's setTimeout

Community
  • 1
  • 1
Pablo Romeo
  • 11,298
  • 2
  • 30
  • 58
  • 1
    Yah .. Its fine. But My question is different. I do not have issue with loading partial view with jquery or ajax or etc. I can load multiple partial views in my view page easily. I want that.. my partial views load within specific time.. 1 by 1. – IT_INFOhUb Apr 03 '13 at 13:39
  • 2
    Mmmm, you mean have one load after the other, or at specific times? Well, just use a javascript timer if you want at specific times, or use the "complete" callback parameter of jquery's .load(), to chain one after the other. – Pablo Romeo Apr 03 '13 at 14:10