|
@{
var ChildGrid = new Syncfusion.EJ2.Grids.Grid()
{
DataSource = (IEnumerable<object>)ViewBag.dataSource,
QueryString = "OrderID",
QueryCellInfo = "QueryCellInfo",
Columns = new List<Syncfusion.EJ2.Grids.GridColumn>
{
...
new Syncfusion.EJ2.Grids.GridColumn() { HeaderText = "SparkLine", Template="#sparklineTemp", Width = "130", TextAlign = Syncfusion.EJ2.Grids.TextAlign.Left, CustomAttributes=new { @class="customcss"} },
}
};
}
<script type="text/javascript">
function QueryCellInfo(args) {
if (args.column.headerText == "SparkLine") {
var column = new ej.charts.Sparkline({
height: '50px',
width: '150px',
type: 'Line',
valueType: 'Numeric',
fill: '#3C78EF',
negativePointColor: '#f7a816',
dataSource: getSparkData('column', 1)
});
column.appendTo(args.cell.getElementsByTagName("div")[0]); @*append the sparkline to the div element in the column*@
}
}
...
</script>
<script type="text/x-template" id="sparklineTemp">
<div id="spkline${EmployeeID}" /> @*set an unique id for this*@
</script>
| 
