In TreeGrid control, you can customize each row by providing templates or Jsrender script elements. These script elements can be provided as templates for the TreeGrid row using RowTemplateId property. The following is the code example for a simple Jsrender template. JS <script id="rowTemplateScript" type="text/x-jsrender”> <tr> <td class="border" style='height:30px;'> <div>{{:#data['EmployeeID']}}</div> </td> //.. </tr> </script> <script id="altRowTemplateScript" type="text/x-jsrender”> <tr> <td class="border" style='height:30px;' /> <div>{{:#data['EmployeeID']}}</div> </td> //.. </tr> </script> For providing alternate row style in TreeGrid using templates, altRowTemplateID property can be used. The following code example is for applying templates for TreeGrid rows. JS <body> <script id="rowTemplateScript" type="text/x-jsrender”> <tr> <td class="border" style='height:30px;'> <div>{{:#data['EmployeeID']}}</div> </td> //.. </tr> </script> <script id="altRowTemplateScript" type="text/x-jsrender”> <tr> <td class="border" style='height:30px;' /> <div>{{:#data['EmployeeID']}}</div> </td> //.. </tr> </script> </script type="text/javascript”> $(function () { $("#treegrid").ejTreeGrid({ dataSource: data, //... //... rowTemplateID: "rowTemplateScript", altRowTemplateID: "altRowTemplateScript" }); }); </script> </body>
|
This page will automatically be redirected to the sign-in page in 10 seconds.