Server side processing, footer callback, Paging Errors
Server side processing, footer callback, Paging Errors
I am using Datatables 1.9.0 with asp.net razor c# with mssql 2008.
Current i am facing this paging error or rather error causes by the footer callback. which i am at wit end on how to solve it.
Because the data is over 20k records, I am using server side processing to get the data from database and doing sorting at server end.
But, I have this small error whenever the user click on any page number, it will give this error as below.
[quote]Uncaught TypeError: Cannot read property 'BCAmount' of undefined[/quote]
which referring to one of my fields
On the 1st load, it is working perfectly and it reflect the total value in the footer. But as long as when user click on next page or different page, it will give this error.
This is my demo site as below.
[quote] http://worldsoft.dyndns.org:81/PatrickDental/SalesOrderListing.cshtml [/quote]
Can anyone help me with that? Thanks. Below are the related coding for the site.
SalesOrderListing.cshtml
[code]
StatusModuleIDSO NoDateClientOur RefPatient
Amount
Total:
[/code]
aSalesOrderListing.js - my Javascript for SalesOrderListing.cshtml
[code]
// Display Listing
$(document).ready(function () {
var MMName = "SO";
var RowID = "";
var oTable = $('#tModuleListing').dataTable({
"iDisplayLength": 25, // Default No of Records per page on 1st load
"aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]], // Set no of records in per page
"aaSorting": [[1, "desc"]], // Default 1st column sorting
"bProcessing": true,
//"bJQueryUI": true, //No themeroller
"aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }, { "bVisible": false, "aTargets": [1]}], // Hide Column
"sAjaxSource": 'Ajax_Functions/ModuleListingSelect.cshtml?MMName=' + MMName,
//"sDom": "frtiS",
"bStateSave": true, // Remember paging & filters
//"bAutoWidth": true,
//"bSortClasses": false,
"bDeferRender": false,
"bServerSide": true,
//"bScrollCollapse": true,
//"sScrollY": "300px",
//"bPaginate": false,
"sPaginationType": "full_numbers", // Include page number
"aoColumns": [
{ "mDataProp": "Status" }, { "mDataProp": "ModuleID" }, { "mDataProp": "ModuleAltID" }, { "mDataProp": "ModuleDate" },
{ "mDataProp": "Client" }, { "mDataProp": "OurRef" }, { "mDataProp": "PatientName" },
{ "mDataProp": "BCAmount" }
],
"fnDrawCallback": function () {
$("#tModuleListing tbody tr").click(function () {
var position = oTable.fnGetPosition(this); // getting the clicked row position
RowID = oTable.fnGetData(position); // getting the value of the first (invisible) column
$.msg("Redirecting", { header: 'Success' });
window.location.href = "SalesOrder.cshtml?MM=" + RowID.ModuleID;
});
$('#tModuleListing tbody tr').each(function () {
this.setAttribute('title', "Click to view detail.");
});
},
"fnFooterCallback": function (nRow, aaData, iStart, iEnd, aiDisplay) {
var iPageInvoiceAmt = 0, iPageBalanceAmt = 0;
for (var i = iStart; i < iEnd; i++) {
iPageInvoiceAmt += parseFloat(aaData[aiDisplay[i]].BCAmount);
}
/* Modify the footer row to match what we want */
var nCells = nRow.getElementsByTagName('th');
nCells[1].innerHTML = iPageInvoiceAmt.toFixed(2);
}
}).makeEditable({
"aoColumns": [null, null, null, null, null, null] // Disable all the inline editable
});
}); // Display Listing -- END
[/code]
ModuleLsitingSelect.cshtml - The ajax file for processing the data (Showing on related code, Not the full file.
[code]
@{
var MMName = Request["MMName"];
var ModuleID = String.IsNullOrEmpty(Request["ModuleID"]) ? "1" : Request["ModuleID"];
var iDisplayLength = String.IsNullOrEmpty(Request["iDisplayLength"]) ? 0 : int.Parse(Request["iDisplayLength"]);
var iDisplayStart = String.IsNullOrEmpty(Request["iDisplayStart"]) ? 0 : int.Parse(Request["iDisplayStart"]);
var iSortCol = String.IsNullOrEmpty(Request["iSortCol_0"]) ? 0 : int.Parse(Request["iSortCol_0"]); // for serverside Datatable
var iSortDir = String.IsNullOrEmpty(Request["sSortDir_0"]) ? "0" : Request["sSortDir_0"]; // for serverside Datatable
var sSearch = String.IsNullOrEmpty(Request["sSearch"]) ? "%" : "%" + Request["sSearch"] + "%"; // for serverside Datatable
int sEcho = String.IsNullOrEmpty(Request["sEcho"]) ? 0 : int.Parse(Request["sEcho"]); // for serverside Datatable
var SQLSelect = "";
var db = Database.Open("WorldSoftConnectionString");
switch (MMName)
{
case "SO":
SQLSelect = "SELECT qrySalesOrderListing.* FROM qrySalesOrderListing WHERE (Client LIKE @0) OR (OurRef LIKE @0) OR (PatientRefNo LIKE @0) OR (PatientName LIKE @0) OR (ModuleAltID LIKE @0) OR (ModuleDate LIKE @0) ORDER BY ModuleID DESC";
// Grab the correct page number
var Data = db.Query(SQLSelect, sSearch).Skip(iDisplayStart).Take(iDisplayLength);
var aaData = Json.Encode(Data);
// Get the total records
var SQLTotal = "SELECT Count(*) FROM mSalesOrder";
var iTotalRecords = db.QueryValue(SQLTotal);
// Get total filtered records
var SQLDisplayTotal = "SELECT Count(*) FROM mSalesOrder WHERE (Client LIKE @0) OR (OurRef LIKE @0) OR (PatientRefNo LIKE @0) OR (PatientName LIKE @0) OR (ModuleAltID LIKE @0) OR (ModuleDate LIKE @0)";
var iTotalDisplayRecords = db.QueryValue(SQLDisplayTotal, sSearch);
// Json
Response.Write("{\"sEcho\":" + sEcho + "," + "\"iTotalRecords\":" + iTotalRecords + "," + "\"iTotalDisplayRecords\":" + iTotalDisplayRecords + ", " + "\"aaData\":" + aaData + "}");
break;
}
}
[/code]
Smile
Chankl78
Current i am facing this paging error or rather error causes by the footer callback. which i am at wit end on how to solve it.
Because the data is over 20k records, I am using server side processing to get the data from database and doing sorting at server end.
But, I have this small error whenever the user click on any page number, it will give this error as below.
[quote]Uncaught TypeError: Cannot read property 'BCAmount' of undefined[/quote]
which referring to one of my fields
On the 1st load, it is working perfectly and it reflect the total value in the footer. But as long as when user click on next page or different page, it will give this error.
This is my demo site as below.
[quote] http://worldsoft.dyndns.org:81/PatrickDental/SalesOrderListing.cshtml [/quote]
Can anyone help me with that? Thanks. Below are the related coding for the site.
SalesOrderListing.cshtml
[code]
StatusModuleIDSO NoDateClientOur RefPatient
Amount
Total:
[/code]
aSalesOrderListing.js - my Javascript for SalesOrderListing.cshtml
[code]
// Display Listing
$(document).ready(function () {
var MMName = "SO";
var RowID = "";
var oTable = $('#tModuleListing').dataTable({
"iDisplayLength": 25, // Default No of Records per page on 1st load
"aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]], // Set no of records in per page
"aaSorting": [[1, "desc"]], // Default 1st column sorting
"bProcessing": true,
//"bJQueryUI": true, //No themeroller
"aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }, { "bVisible": false, "aTargets": [1]}], // Hide Column
"sAjaxSource": 'Ajax_Functions/ModuleListingSelect.cshtml?MMName=' + MMName,
//"sDom": "frtiS",
"bStateSave": true, // Remember paging & filters
//"bAutoWidth": true,
//"bSortClasses": false,
"bDeferRender": false,
"bServerSide": true,
//"bScrollCollapse": true,
//"sScrollY": "300px",
//"bPaginate": false,
"sPaginationType": "full_numbers", // Include page number
"aoColumns": [
{ "mDataProp": "Status" }, { "mDataProp": "ModuleID" }, { "mDataProp": "ModuleAltID" }, { "mDataProp": "ModuleDate" },
{ "mDataProp": "Client" }, { "mDataProp": "OurRef" }, { "mDataProp": "PatientName" },
{ "mDataProp": "BCAmount" }
],
"fnDrawCallback": function () {
$("#tModuleListing tbody tr").click(function () {
var position = oTable.fnGetPosition(this); // getting the clicked row position
RowID = oTable.fnGetData(position); // getting the value of the first (invisible) column
$.msg("Redirecting", { header: 'Success' });
window.location.href = "SalesOrder.cshtml?MM=" + RowID.ModuleID;
});
$('#tModuleListing tbody tr').each(function () {
this.setAttribute('title', "Click to view detail.");
});
},
"fnFooterCallback": function (nRow, aaData, iStart, iEnd, aiDisplay) {
var iPageInvoiceAmt = 0, iPageBalanceAmt = 0;
for (var i = iStart; i < iEnd; i++) {
iPageInvoiceAmt += parseFloat(aaData[aiDisplay[i]].BCAmount);
}
/* Modify the footer row to match what we want */
var nCells = nRow.getElementsByTagName('th');
nCells[1].innerHTML = iPageInvoiceAmt.toFixed(2);
}
}).makeEditable({
"aoColumns": [null, null, null, null, null, null] // Disable all the inline editable
});
}); // Display Listing -- END
[/code]
ModuleLsitingSelect.cshtml - The ajax file for processing the data (Showing on related code, Not the full file.
[code]
@{
var MMName = Request["MMName"];
var ModuleID = String.IsNullOrEmpty(Request["ModuleID"]) ? "1" : Request["ModuleID"];
var iDisplayLength = String.IsNullOrEmpty(Request["iDisplayLength"]) ? 0 : int.Parse(Request["iDisplayLength"]);
var iDisplayStart = String.IsNullOrEmpty(Request["iDisplayStart"]) ? 0 : int.Parse(Request["iDisplayStart"]);
var iSortCol = String.IsNullOrEmpty(Request["iSortCol_0"]) ? 0 : int.Parse(Request["iSortCol_0"]); // for serverside Datatable
var iSortDir = String.IsNullOrEmpty(Request["sSortDir_0"]) ? "0" : Request["sSortDir_0"]; // for serverside Datatable
var sSearch = String.IsNullOrEmpty(Request["sSearch"]) ? "%" : "%" + Request["sSearch"] + "%"; // for serverside Datatable
int sEcho = String.IsNullOrEmpty(Request["sEcho"]) ? 0 : int.Parse(Request["sEcho"]); // for serverside Datatable
var SQLSelect = "";
var db = Database.Open("WorldSoftConnectionString");
switch (MMName)
{
case "SO":
SQLSelect = "SELECT qrySalesOrderListing.* FROM qrySalesOrderListing WHERE (Client LIKE @0) OR (OurRef LIKE @0) OR (PatientRefNo LIKE @0) OR (PatientName LIKE @0) OR (ModuleAltID LIKE @0) OR (ModuleDate LIKE @0) ORDER BY ModuleID DESC";
// Grab the correct page number
var Data = db.Query(SQLSelect, sSearch).Skip(iDisplayStart).Take(iDisplayLength);
var aaData = Json.Encode(Data);
// Get the total records
var SQLTotal = "SELECT Count(*) FROM mSalesOrder";
var iTotalRecords = db.QueryValue(SQLTotal);
// Get total filtered records
var SQLDisplayTotal = "SELECT Count(*) FROM mSalesOrder WHERE (Client LIKE @0) OR (OurRef LIKE @0) OR (PatientRefNo LIKE @0) OR (PatientName LIKE @0) OR (ModuleAltID LIKE @0) OR (ModuleDate LIKE @0)";
var iTotalDisplayRecords = db.QueryValue(SQLDisplayTotal, sSearch);
// Json
Response.Write("{\"sEcho\":" + sEcho + "," + "\"iTotalRecords\":" + iTotalRecords + "," + "\"iTotalDisplayRecords\":" + iTotalDisplayRecords + ", " + "\"aaData\":" + aaData + "}");
break;
}
}
[/code]
Smile
Chankl78
This discussion has been closed.
Replies
Smile
Chankl78