column.type : text|checkbox|icon|date|time|datetimeDefault: 'text'

Indicates the type of the column.

Examples

Bootstrap 3 Icon

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap',
         columns: [
             { field: 'ID', width: 34 },
             { field: 'Name', title: 'Player' },
             { field: 'PlaceOfBirth', title: 'Place of Birth' },
             {
               title: '', field: 'Info', width: 32, type: 'icon', icon: 'glyphicon-info-sign',
               events: {
                 'click': function (e) {
                     alert('record with id=' + e.data.id + ' is clicked.');
                 }
               }
             }
         ]
     });
 </script>

  

Bootstrap 4 Icon

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap4',
         columns: [
             { field: 'ID', width: 42 },
             { field: 'Name', title: 'Player' },
             { field: 'PlaceOfBirth', title: 'Place of Birth' },
             {
               title: '', field: 'Info', width: 42, type: 'icon', icon: 'fa fa-pencil',
               events: {
                 'click': function (e) {
                     alert('record with id=' + e.data.id + ' is clicked.');
                 }
               }
             }
         ]
     });
 </script>

  

Bootstrap 3 Checkbox

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap',
         columns: [
             { field: 'ID', width: 34 },
             { field: 'Name', title: 'Player' },
             { field: 'PlaceOfBirth', title: 'Place of Birth' },
             { title: 'Active?', field: 'IsActive', width: 80, type: 'checkbox', align: 'center' }
         ]
     });
 </script>

  

Bootstrap 4 Checkbox

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap4',
         columns: [
             { field: 'ID', width: 46 },
             { field: 'Name', title: 'Player' },
             { field: 'PlaceOfBirth', title: 'Place of Birth' },
             { title: 'Active?', field: 'IsActive', width: 80, type: 'checkbox', align: 'center' }
         ]
     });
 </script>