Dynamically loading a view, telerik mvc

Question

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

If you look in devtools can you see the presence of gridName in the HTML? — Mathew Thompson
– Mathew Thompson, Commented May 23, 2012 at 20:00
yes, the name is there, when the page 'Create' is loaded the 'datagrid' works perfectly, but when loaded via ajax call, not — André Moraes
– André Moraes, Commented May 23, 2012 at 21:11

Heretic Monkey · Accepted Answer · 2012-05-24 18:27:34Z

1

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.

edited May 24, 2012 at 18:27

answered May 23, 2012 at 21:23

Heretic Monkey

12.2k7 gold badges63 silver badges133 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

André Moraes Over a year ago

When the Grid is rendered on a page, Telerik adds javascript to the jQuery(document).ready() function to create the $('#Grid').data('tGrid') object. This is the problem, i can't get the data('tGrid'). tks

Heretic Monkey Over a year ago

So, did you try using jQuery.load?

Collectives™ on Stack Overflow

Dynamically loading a view, telerik mvc

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related