In following code, Export to Excel is not working. Am I doing something wrong ?
@using Syncfusion.EJ2.Navigations
@using TestWithFilterableComboBox.ViewModels
@model TestWithFilterableComboBox.ViewModels.ReportViewModel
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
@using (Html.BeginForm())
{
<table style="width: 100%">
<tr>
<th>JobName</th>
<th>Queued</th>
<th>LineNo</th>
</tr>
<tr>
<td> @Html.DropDownListFor(x => x.JobName, new SelectList(Model.Jobs, "Value", "Text"), "Job", new { style = "width: 450px;" })</td>
<td> @Html.DropDownListFor(x => x.QueuedBeamStatus, new SelectList(Model.Queues, "Value", "Text"), "Queue", new { style = "width: 450px;" })</td>
<td> @Html.DropDownListFor(x => x.LineName, new SelectList(Model.Lines, "Value", "Text"), "Line", new { style = "width: 450px;" })</td>
</tr>
</table>
<br />
<button type="submit">Search</button>
<br />
<br />
@(Html.EJS().Grid("TestGrid").DataSource(Model.Report).Columns(col =>
{
col.Field("Workorderid").HeaderText("Work Order Id").Width(150).Add();
col.Field("FullFilename").HeaderText("Full File Name").Add();
}).AllowPaging(true).PageSettings(o => o.PageSize(10)).AllowSorting().AllowExcelExport().ToolbarClick("toolbarClick").AllowPdfExport().Toolbar(new List<string>() { "Print", "Search", "ExcelExport", "PdfExport" }).Render())
}
<style>
.orientationcss .e-headercelldiv {
transform: rotate(90deg);
}
</style>
<script>
function toolbarClick(args) {
var gridObj = document.getElementById("TestGrid").ej2_instances[0];
if (args.item.id === 'Grid_excelexport') {
gridObj.excelExport();
}
}
</script>
<script type="text/javascript">
$(function () {
$("#JobName").change(function () {
var val = $(this).val();
var subItems="";
$.getJSON("@Url.Action("GetQueues","Report")", {id:val} ,function (data) {
$.each(data,function(index,item){
subItems+="<option value='"+item.Value+"'>"+item.Text+"</option>";
});
$("#QueuedBeamStatus").html(subItems);
});
var subItems2="";
$.getJSON("@Url.Action("GetLines","Report")", {id:val} ,function (data) {
$.each(data,function(index,item){
subItems2+="<option value='"+item.Value+"'>"+item.Text+"</option>";
});
$("#LineName").html(subItems2);
});
});
});
</script>