detailTemplate : stringDefault: undefined

Template for the content in the detail section of the row. Automatically add expand collapse column as a first column in the grid during initialization.

Examples

Material Design

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'materialdesign',
         detailTemplate: '<div style="text-align: left"><b>Place Of Birth:</b> {PlaceOfBirth}</div>',
         columns: [ { field: 'ID', width: 56 }, { field: 'Name' }, { field: 'DateOfBirth', type: 'date' } ]
     });
 </script>

Bootstrap 3

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap',
         detailTemplate: '<div><b>Place Of Birth:</b> {PlaceOfBirth}</div>',
         columns: [ { field: 'ID', width: 34 }, { field: 'Name' }, { field: 'DateOfBirth', type: 'date' } ]
     });
 </script>

Bootstrap 4 Font Awesome

    
 <table id="grid"></table>
 <script>
     $('#grid').grid({
         dataSource: '/Players/Get',
         uiLibrary: 'bootstrap4',
         iconsLibrary: 'fontawesome',
         detailTemplate: '<div><b>Place Of Birth:</b> {PlaceOfBirth}</div>',
         columns: [ { field: 'ID', width: 34 }, { field: 'Name' }, { field: 'DateOfBirth', type: 'date' } ]
     });
 </script>