removeRowReturns: grid

Remove row from the grid

This method is design to work only with local datasources. If you use remote datasource, you need to send a request to the server to remove the row and then reload the data in the grid.

Parameters

NameTypeDescription
id {string} Id of the record that needs to be removed.

Examples

Without Pagination

    
 <table id="grid"></table>
 <script>
     var grid;
     function Delete(e) {
         if (confirm('Are you sure?')) {
             grid.removeRow(e.data.id);
         }
     }
     grid = $('#grid').grid({
         primaryKey: 'ID',
         dataSource: [
             { 'ID': 1, 'Name': 'Hristo Stoichkov', 'PlaceOfBirth': 'Plovdiv, Bulgaria' },
             { 'ID': 2, 'Name': 'Ronaldo Luís Nazário de Lima', 'PlaceOfBirth': 'Rio de Janeiro, Brazil' },
             { 'ID': 3, 'Name': 'David Platt', 'PlaceOfBirth': 'Chadderton, Lancashire, England' }
         ],
         columns: [
             { field: 'ID', width: 56 },
             { field: 'Name' },
             { field: 'PlaceOfBirth' },
             { width: 100, align: 'center', tmpl: '<u class="gj-cursor-pointer">Delete</u>', events: { 'click': Delete } }
         ]
     });
 </script>

With Pagination

    
 <table id="grid"></table>
 <script>
     var grid;
     function Delete(e) {
         if (confirm('Are you sure?')) {
             grid.removeRow(e.data.id);
         }
     }
     grid = $('#grid').grid({
         primaryKey: 'ID',
         dataSource: [
             { 'ID': 1, 'Name': 'Hristo Stoichkov', 'PlaceOfBirth': 'Plovdiv, Bulgaria' },
             { 'ID': 2, 'Name': 'Ronaldo Luís Nazário de Lima', 'PlaceOfBirth': 'Rio de Janeiro, Brazil' },
             { 'ID': 3, 'Name': 'David Platt', 'PlaceOfBirth': 'Chadderton, Lancashire, England' }
         ],
         columns: [
             { field: 'ID', width: 56 },
             { field: 'Name' },
             { field: 'PlaceOfBirth' },
             { width: 100, align: 'center', tmpl: '<u class="gj-cursor-pointer">Delete</u>', events: { 'click': Delete } }
         ],
         pager: { limit: 2, sizes: [2, 5, 10, 20] }
     });
 </script>