Issue using sAjaxSource and ASP.NET WebMethod
Issue using sAjaxSource and ASP.NET WebMethod
kcauchi
Posts: 2Questions: 0Answers: 0
I am trying to create a datatable with server side paging on ASP.NET.
At first I tried to make use of the sAjaxSource without the the extra ajax (and used aoData.push for extra values). For some reason it did not work. I used fiddler to check what values it was sending.. everything seems correct but it does not return an error it just returns the whole page's HTML and the method is never called.
After searching around, i found that I can make an ajax call within fnServerData.. but now it seems like that is the only call made and values like "iDisplayLength" are not being sent over. That code is shown below.
Can anyone tell me how to do this please?
Thanks!
JS
[code]
logsTable = $('#grdEmailLogs').dataTable({
"bProcessing": true,
"bServerSide": true,
"bFilter": false,
"bSort": false,
"bDestroy": true,
"sAjaxSource": "Dashboard.aspx/LoadEmailsLogs",
"fnServerData": function (sSource, aoData, fnCallback) {
// make ajax request, and assign request to variable
logsRequest = $.ajax({
type: "POST",
url: sSource,
data: "{ sender: '" + txtFilterSender.value + "', recipient: '" + txtFilterRecipient.value + "', subject: '" + txtFilterSubject.value + "', scanResult: '" + cmbFilterResult.options[cmbFilterResult.selectedIndex].value + "', fromFilterScanDateMils: '" + fromFilterScanDate + "', toFilterScanDateMils: '" + toFilterScanDate + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//var json = $.evalJSON(data.d);
fnCallback(data.d);
}
});
},
"sPaginationType": "full_numbers",
"sPageButton": "paginate_button",
"sPageButtonActive": "paginate_active",
"sPageButtonStaticDisabled": "paginate_button"
});
[/code]
C#
[code]
[WebMethod]
public static string LoadEmailsLogs(
String sender,
String recipient,
String subject,
String scanResult,
String fromFilterScanDateMils,
String toFilterScanDateMils)
{
MasterClass.LogDebug("DashboardLogs::LoadLogs...", _cat);
*CODE NOT SHOWN HERE*
string returnValue = "";
try
{
FormatedList fl = new FormatedList();
fl.sEcho = Convert.ToInt32(HttpContext.Current.Request.QueryString["sEcho"]);
fl.SetData(dashboardLogs);
fl.iTotalDisplayRecords = dashboardLogs.TotalLogsCount;
fl.iTotalRecords = dashboardLogs.TotalLogsCount;
fl.sColumns =
"icon," +
StringsProvider1.GetString("/DashboardLogs_ascx.SenderColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.RecipientColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.SubjectColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.ScanResultColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.ViewColumn");
returnValue = new JavaScriptSerializer().Serialize(fl);
MasterClass.LogDebug("--- returnValue - " + returnValue, _cat);
//return fl;
}
catch (Exception ex)
{
MasterClass.LogError(ex.ToString(), _cat);
}
return returnValue;
}
[/code]
At first I tried to make use of the sAjaxSource without the the extra ajax (and used aoData.push for extra values). For some reason it did not work. I used fiddler to check what values it was sending.. everything seems correct but it does not return an error it just returns the whole page's HTML and the method is never called.
After searching around, i found that I can make an ajax call within fnServerData.. but now it seems like that is the only call made and values like "iDisplayLength" are not being sent over. That code is shown below.
Can anyone tell me how to do this please?
Thanks!
JS
[code]
logsTable = $('#grdEmailLogs').dataTable({
"bProcessing": true,
"bServerSide": true,
"bFilter": false,
"bSort": false,
"bDestroy": true,
"sAjaxSource": "Dashboard.aspx/LoadEmailsLogs",
"fnServerData": function (sSource, aoData, fnCallback) {
// make ajax request, and assign request to variable
logsRequest = $.ajax({
type: "POST",
url: sSource,
data: "{ sender: '" + txtFilterSender.value + "', recipient: '" + txtFilterRecipient.value + "', subject: '" + txtFilterSubject.value + "', scanResult: '" + cmbFilterResult.options[cmbFilterResult.selectedIndex].value + "', fromFilterScanDateMils: '" + fromFilterScanDate + "', toFilterScanDateMils: '" + toFilterScanDate + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//var json = $.evalJSON(data.d);
fnCallback(data.d);
}
});
},
"sPaginationType": "full_numbers",
"sPageButton": "paginate_button",
"sPageButtonActive": "paginate_active",
"sPageButtonStaticDisabled": "paginate_button"
});
[/code]
C#
[code]
[WebMethod]
public static string LoadEmailsLogs(
String sender,
String recipient,
String subject,
String scanResult,
String fromFilterScanDateMils,
String toFilterScanDateMils)
{
MasterClass.LogDebug("DashboardLogs::LoadLogs...", _cat);
*CODE NOT SHOWN HERE*
string returnValue = "";
try
{
FormatedList fl = new FormatedList();
fl.sEcho = Convert.ToInt32(HttpContext.Current.Request.QueryString["sEcho"]);
fl.SetData(dashboardLogs);
fl.iTotalDisplayRecords = dashboardLogs.TotalLogsCount;
fl.iTotalRecords = dashboardLogs.TotalLogsCount;
fl.sColumns =
"icon," +
StringsProvider1.GetString("/DashboardLogs_ascx.SenderColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.RecipientColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.SubjectColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.ScanResultColumn") + "," +
StringsProvider1.GetString("/DashboardLogs_ascx.ViewColumn");
returnValue = new JavaScriptSerializer().Serialize(fl);
MasterClass.LogDebug("--- returnValue - " + returnValue, _cat);
//return fl;
}
catch (Exception ex)
{
MasterClass.LogError(ex.ToString(), _cat);
}
return returnValue;
}
[/code]
This discussion has been closed.
Replies
This is what I did:
JS
[code]
logsTable = $('#grdEmailLogs').dataTable({
"bProcessing": true,
"bServerSide": true,
"bFilter": false,
"bSort": false,
"bDestroy": true,
"bInfo": true,
"sAjaxSource": "Dashboard.aspx/LoadEmailsLogs",
"fnServerData": function (sSource, aoData, fnCallback) {
/* Add some extra data to the sender */
aoData.push({ "name": "sender", "value": txtFilterSender.value });
aoData.push({ "name": "recipient", "value": txtFilterRecipient.value });
aoData.push({ "name": "subject", "value": txtFilterSubject.value });
aoData.push({ "name": "scanResult", "value": cmbFilterResult.options[cmbFilterResult.selectedIndex].value });
aoData.push({ "name": "fromFilterScanDateMils", "value": fromFilterScanDate });
aoData.push({ "name": "toFilterScanDateMils", "value": toFilterScanDate });
var data = "{ ";
for (var i = 0; i < aoData.length; i++) {
data += aoData[i].name + ": ";
data += "'" + aoData[i].value + "'";
if (i != (aoData.length - 1))
data += ", ";
}
data += " }";
// make ajax request, and assign request to variable
logsRequest = $.ajax({
type: "POST",
url: sSource,
data: data,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
fnCallback(data.d);
}
});
},
"sPaginationType": "full_numbers",
"sPageButton": "paginate_button",
"sPageButtonActive": "paginate_active",
"sPageButtonStaticDisabled": "paginate_button"
});
[/code]
C#
[code]
[WebMethod]
public static FormatedList LoadEmailsLogs(string sEcho, string iColumns, string sColumns,
string iDisplayStart, string iDisplayLength, string mDataProp_0, string mDataProp_1 ,
string mDataProp_2, string mDataProp_3, string mDataProp_4, string mDataProp_5,
string mDataProp_6, string sender, string recipient, string subject, string scanResult,
string fromFilterScanDateMils, string toFilterScanDateMils)
{
MasterClass.LogDebug("DashboardLogs::LoadLogs...", _cat);
FormatedList fl = new FormatedList();
*CODE NOT SHOWN HERE*
try
{
fl.sEcho = Convert.ToInt32(sEcho);
fl.SetData(dashboardLogs);
fl.iTotalDisplayRecords = dashboardLogs.TotalLogsCount;
fl.iTotalRecords = dashboardLogs.TotalLogsCount;
}
catch (Exception ex)
{
MasterClass.LogError(ex.ToString(), _cat);
}
return fl;
}
[/code]
My only problem is that the JS is in a method that is called by a timer every 10 seconds so it is being redrawn every time (it also loses the current page index). Any idea what I can do?
Thanks