Apply template for dynamic generated column

[Catalin Radoi]

Hi. I have a grid that doesn't specify the columns (they are autogenerated).

I want, though, for the Column "X" to apply a template.

<script type="text/x-jsrender" id="xTemplate">

.............

</script>

How can I accomplish this? (maybe the databound event?)

[Pavithra Subramaniyam]

Hi Catalin, 

WE have checked our query and you can achieve your requirement by compiling the template string into executable function using compile method in queryCellInfo event which will trigger for each cell of Essential JavaScript 2 Grid component. Please refer to the code example, documentation link and sample link. 

[index.html] 

<script id="template" type="text/x-template"> 

    <div class="image"> 

        <img src="https://ej2.syncfusion.com/demos/src/grid/images/${EmployeeID}.png" alt="${EmployeeID}" /> 

    </div> 

</script> 

[index.ts] 

let grid: Grid = new Grid ({ 

    dataSource: data, 

    queryCellInfo: info, 

    }); 

grid.appendTo('#Grid'); 

function info(args: QueryCellInfoEventArgs) { 

   if (args.column.field === 'EmployeeID') { 

      let template: string = document.querySelector('#template').innerHTML.trim(); 

      let qcell: any = args.data; 

      let getDOMString: (qcell: Object, component: Grid, template: string) => HTMLCollection = compile(template);   //compiles the template string 

      args.cell.innerHTML = <any>getDOMString(qcell, grid, 'template')[0].outerHTML; 

      args.cell.classList.add('e-templatecell'); 

   } 

} 

Documentation :1. http://ej2.syncfusion.com/16.1.24/documentation/grid/api-grid.html?lang=typescript#querycellinfo 

                              2. http://ej2.syncfusion.com/16.1.24/documentation/base/template-engine.html?lang=typescript 

Sample               : https://plnkr.co/edit/9pvv0LxEaIQQGodb5g3A?p=preview 

Regards, 

Pavithra S. 

[Catalin Radoi]

Thanks, Pavithra, but.. can you provide code for the MVC version?

@(Html.EJ().Grid<>......

[Thavasianand Sankaranarayanan]

Hi Catalin, 

As per your suggestion we have prepared a sample in ASP.NET MVC and it can be downloadable from the below location. 

Sample: http://www.syncfusion.com/downloads/support/forum/136180/ze/SyncfusionMvcApplication13_(3)-919611938.zip 

Regards, 

Thavasianand S.