destroyReturns: void

Destroy the grid. This method remove all data from the grid and all events attached to the grid.

The grid table tag and wrapper tag are kept by default after the execution of destroy method,but you can remove them if you pass false to the keepTableTag and keepWrapperTag parameters.

Fires

destroying

Parameters

NameTypeDescription
keepTableTag {boolean} If this flag is set to false, the table tag will be removed from the HTML dom tree.
keepWrapperTag {boolean} If this flag is set to false, the table wrapper tag will be removed from the HTML dom tree.

Examples

keep wrapper and table

    
 <button class="gj-button-md" id="btnDestroy">Destroy</button>
 <button class="gj-button-md" id="btnCreate">Create</button>
 <br/><br/>
 <table id="grid"></table>
 <script>
     var createFunc = function() {
         $('#grid').grid({
             dataSource: '/Players/Get',
             columns: [ { field: 'ID', width: 56 }, { field: 'Name' }, { field: 'PlaceOfBirth' } ]
         });
     };
     createFunc();
     $('#btnDestroy').on('click', function () {
         $('#grid').grid('destroy', true, true);
     });
     $('#btnCreate').on('click', function () {
         createFunc();
     });
 </script>

remove wrapper and table

    
 <button class="gj-button-md" id="btnRemove">Remove</button>
 <br/><br/>
 <table id="grid"></table>
 <script>
     var grid = $('#grid').grid({
         dataSource: '/Players/Get',
         columns: [ { field: 'ID', width: 56 }, { field: 'Name' }, { field: 'PlaceOfBirth' } ]
     });
     $('#btnRemove').on('click', function () {
         grid.destroy();
     });
 </script>