Cindy
Cindy

Reputation: 35

jQuery to load new view and then load partial view

I have a asp.net MVC view. A button click on this view should redirect the user to another view. The second view is built with few partial views. One of the partial view is taking long time to load, so i don't want this overhead on the page load and i want that partial view to run on ajax call, so that it can run asynchronously. But on redirect, I want to return the second view with other partial views. Please suggest a workaround for this.

 $(document).on('click', '#buttonClick', function () {
    window.location = '/some/someAction?id=123';
     $.ajax ({
        type: 'GET',
        url: '/some/LoadPartialView?id=123',

        success: function(data){
             $('#timeTakingPartialView').html(data);

        }
    });

});

Window.location is redirecting to second view after the ajax call. So reload is stepping over the ajax call.

Upvotes: 1

Views: 1527

Answers (1)

Aleksandr Neizvestnyi
Aleksandr Neizvestnyi

Reputation: 578

If I understand you right, you want to load that partial view before call main view. I don't think that is possible. I would suggest adding this partial view "lazy" loading on the second view. So for the first view you only need to add button click event:

$(document).on('click', '#buttonClick', function () {
    window.location = '/some/someAction?id=123'; 
});

And when you locate to the second view (someAction), you able to load on a ready event when the DOM is loaded:

$(document).ready(function () {
     $.ajax ({
        type: 'GET',
        url: '/some/LoadPartialView?id=123',

        success: function(data){
             $('#timeTakingPartialView').html(data);
        }
    });
});

So, the loading of a slow partial view will be separated.

Upvotes: 1

Related Questions