Как уничтожить сетку кендо, которая находится внутри вкладки кендо?

Question

Закладка:

<div id="parentTabStrip"> 
      <ul> 
       <li class="k-state-active">Titles</li> 
       <li>Commercials</li> 
      </ul> 
      <div id="titlesGrid"></div> 
      <div id="commercialsGrid"></div> 
     </div> 

На странице загрузки, сетка будет создаваться:

<script type="text/javascript"> 
     var year = $("#txtYear").val(); 
     createTitlesGrid(year); 
     createCommercialsGrid(); 
    </script> 

Я пытаюсь уничтожить сетку на события, но селектор JQuery не находит свою сетку:

<script type="text/javascript"> 
      var year = $("#txtYear").val(); 
      createTitlesGrid(year); 
      createCommercialsGrid(); 

      $('#txtYear').on('change', function() 
      { 
       debugger; 

       $('#titlesGrid').data("kendoGrid").destroy(); 

       $('#commercialsGrid').data("kendoGrid").destroy(); 

       //var year = this.value; 
       //createTitlesGrid(year); 
       //createCommercialsGrid(); 
      }); 
     </script> 

Он продолжает говорить:

TypeError: не могу назвать м еню 'уничтожить' нулевых

Answer 1

var kendoGrid = $("#grid").data("kendoGrid"); 
kendoGrid.destroy(); // Unhook from DOM 
$("#grid").remove(); // Remove from DOM 

Answer 2

Учитывая вы создаете Кендо сетке правильный путь, это должно работать:

<script type="text/javascript"> 
     $(document).ready(function() { 
      var year = $("#txtYear").val(); 
      createTitlesGrid(year); 
      createCommercialsGrid(); 

      $('#txtYear').on('change', function() 
      { 
       debugger; 

       $('#titlesGrid').data("kendoGrid").destroy(); 

       $('#commercialsGrid').data("kendoGrid").destroy(); 

       //var year = this.value; 
       //createTitlesGrid(year); 
       //createCommercialsGrid(); 
      }); 
     }); 
</script> 

Try:

var grid = $('#titlesGrid').data("kendoGrid"); 
grid.destroy(); 

Документация кендо Ui: http://docs.kendoui.com/api/web/grid#methods-destroy