Jtable in toolbars provides items list where to add function
items: [{
icon: 'Content/images/myexcel.png',
text: 'Export to Excel',
click: function () {
transferToExcel();
}
, however I can't find the way to get jtable loaded data which I can use in that function.
Here is my .cshtml
@{
ViewBag.Title = "TimelinessReportCRU";
Layout = null;
}
<div id="filtering">
<form name="timelinessReportCRU">
<div id="oblock">
<div class="dtable">
<div class="drow">
<div class="dcell">
Site Id: <select id="site" >
<option value="Select Site">All</option>
<option value="All" selected>All</option>
<option value="Chicago">Chicago</option>
<option value="Dallas">Dallas</option>
<option value="Phoenix">Phoenix</option>
</select>
</div>
<div class="dcell">
Timeliness Type :
<select id="timelinessType" >
<option value="Delayed" selected>Delayed</option>
<option value="All">All</option>
<option value="On Time">On Time</option>
</select>
</div>
<div class="dcell">
</div>
<div class="dcell">
<button type="submit" id="LoadRecordsRep1"> GetData</button>
</div>
<div class="dcell">
@Html.ActionLink("Excel", "TimelinessReportCruExcel", "Reports", new {@class = "xcelbutton"})
</div>
</div>
</div>
</div>
</form>
</div>
<div id="TimelinessReportCRU"></div>
<script type="text/javascript">
var mydata;
$(document).ready(function () {
$('#TimelinessReportCRU').jtable({
title: 'Timeliness Report CRU',
toolbar: {
hoverAnimation: true, //Enable/disable small animation on mouse hover to a toolbar item.
hoverAnimationDuration: 60, //Duration of the hover animation.
hoverAnimationEasing: undefined, //Easing of the hover animation. Uses jQuery's default animation ('swing') if set to undefined.
items: [{
icon: 'Content/images/myexcel.png',
text: 'Export to Excel',
click: function () {
transferToExcel();
}
}] //Array of your custom toolbar items.
},
paging: true,
pageSize: 20,
sorting: true,
recordsLoaded : function (event,data) {
mydata = data;
},
defaultSorting: 'TransNumber ASC',
actions: {
listAction: '@Url.Action("TimelinessReportCruList")',
},
fields: {
TransNumber: {
title: 'Transaction Number',
},
Site: {
title: 'Site',
},
FilingType: {
title: 'Filing Type',
},
BinNumber: {
title: 'Bin Number',
},
WorkFlowState: {
title: 'Work Flow State',
},
Status: {
title: 'Status',
},
BeenToLibrary: {
title: 'Been To Library',
},
DecisionTime: {
title: 'Decision Date Time (CT)',
},
DayDifference: {
title: 'Day Difference',
},
Timeliness: {
title: 'Timeliness',
}
}
});
$('#LoadRecordsRep1').click(function (e) {
e.preventDefault();
$('#TimelinessReportCRU').jtable('load', {
site: $("#site option:selected").text(),
timelinessType: $("#timelinessType option:selected").text()
});
});
//Load all records when page is first shown
$('#LoadRecordsRep1').click();
});
function transferToExcel() {
$.get("/Reports/TimelinessReportCruExcel2");
}
</script>