Home / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > General Discussions > Loading Telerik Grid from an AJAX response

• Aled

  Posted on Apr 27, 2012 (permalink)

  Hi,
  
  I'm changing the grids in an ASP.NET MVC application from WebGrid to Telerik's MVC Grid.
  
  My grids reside in partial views that receive an IEnumerable<> with the data to display. Those partial views are rendered by many other views. Their respective action methods fetch the actual data for the partial view.
  
  I want sorting, filtering and grouping via AJAX. But because I can't know in my partial view where the data is coming from, I can't use the grid's AJAX binding.
  
  For Web grid I used jQuery's .live() and .load() to insert the sorted grid in place of the older one. But when I do the same with Telerk's grid the filter button no longer works (it isn't clickable). I'm assuming the filter button loses its events, but how do I set them?
   
  
  

  $(document).ready(function () {

      $('.content table thead tr a').live('click', updateGrid);

  }

   

  function updateGrid(e) { // http://msdn.microsoft.com/en-us/magazine/hh288075.aspx

         e.preventDefault();

          var url = $(this).attr('href');

          var grid = $(this).parents('.ajaxGrid');

          if (grid.size() > 0) { // It's a WebGrid, works great

              var gridId = grid.attr('id');

              grid.load(url + ' #' + gridId);

          }

          else { // It's Telerik's Grid. Sorting works but the filter button doesn't.

              var grid = $(this).parents('.t-grid');

              var gridId = grid.attr('id');

              grid.parent().load(url + ' #' + gridId);

              /* WHAT DO I DO HERE? */

          }

  };

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > General Discussions > Loading Telerik Grid from an AJAX response