CODEWITHSUNDEEP
javascriptjqueryasp.net-mvcteleriktelerik-mvc
André Moraes
André Moraes

Reputation: 324

Dynamically loading a view, telerik mvc

I'm trying to load a page using $.ajax(). I have view person with the actions: Index, Create, Delete. The page Create, has a Grid of Telerik MVC. The problem occurs when I'm on page Index and load the page Create with an ajax call to replace the contents of the current page. The page is fully loaded but the grid does not work, $('#gridname').data('tGrid') returns undefined.

A example of the javascript code.

$.ajax({
    url: '/Person/Create',
    contentType: 'application/html; charset=utf-8',
    type: 'GET',
    dataType: 'html',
    cache: false,
    success: function (data) {
        $('#main').html($(data).fadeIn(fade));
    }
});

Thank's

Upvotes: 1

Views: 2262

Answers (1)

Heretic Monkey
Heretic Monkey

Reputation: 12115

I've faced this problem many times. The issue is that when a Telerik control on a partial view is rendered, it adds a script tag with the JavaScript needed to initialize the control. jQuery strips that script tag out if you use $.ajax. Try the following:

$('#main').load('/Person/Create');

jQuery.load does not string out the script tag.

EDIT:

Looks like there's more to it than just load. Telerik has an article about it here:

http://www.telerik.com/help/aspnet-mvc/using-with-partial-views-loaded-via-ajax.html

Basically, you need to make sure the Telerik scripts are referenced in the page (since they won't be automatically added) and you must use ajax to bind the data.

Upvotes: 1

Related Questions