Jquery DataTable passing a parameter to ajax call

2019-05-22 20:52发布

问题:

Below is my java script code to Populate my HTML table with server data and I am using Jquery DataTables to server this purpose.

function LoadData(result) {
$('#example').DataTable({
"ajax": {
   "dataType": 'json',
   "contentType": "application/json; charset=utf-8",
   "type": "POST",
   "url": "index.aspx/Risky",
   "data": function (d) {
    return JSON.stringify( d )
    //return JSON.stringify(result);
    // d.extra_search = result;      
    //"extra_search": result

   },
   "dataSrc": function (json) {
       return $.parseJSON(json.d);
   }
},
"columns": [
    { "data": "Prctice_Group_Risk_No" },
    { "data": "Practice_Group" },
    { "data": "Risk_Category" },
 ]
});
}

Below is my code behind web method description

[WebMethod]
[ScriptMethod]
public static string Risky()
{
  return JsonConvert.SerializeObject(riskList);
}

Until now its working fine, My web method gets called and my HTML table gets populated.

But my problem is that I want to pass the variable "result" as parameter to this ajax call so that my web method receives it and returns me a specific data based over this parameter.

I have visited https://datatables.net/reference/option/ajax.data and tried to follow all of the methods described there to pass the extra data with my ajax call as you can see in my java script code three commented lines of code,I have tried this three different ways but none of it works for me causing me to a single same problem, "Invalid JSON primitive" with a 500 server status code in my firebug debugger. I can see in my firebug debugger that the parameter being passed to the method is "extra_search=123"

I can guess from the error description that my way of adding this extra parameter is not correct , e.g somehow it doesn't make a correct json format. but I don't know how to correct it.

Anyone kindly help.

回答1:

Try this:

function LoadData(result) {
   $('#example').DataTable({
        "ajax": {
                "url": "index.aspx/Risky",
                "data": function(d) {
                        d.param1  = 'param1';
                }
        },
        "aoColumns": [
            { "data": "Prctice_Group_Risk_No" },
            { "data": "Practice_Group" },
            { "data": "Risk_Category" }
        ]
    });
}


回答2:

With the help of @Sanjay Kumar N S and this link

https://datatables.net/forums/discussion/24546/ajax-data-invalid-json-primitive-error

I could be able to solve my problem. The problem was that not a valid formatted JSON data was being sent to the server so the server was throwing an exception of "Invalid JSON Primitive"

Following is the correct format to send a an ajax call containing extra data from within the DataTable function

function LoadData(result) {
$('#example').DataTable({
"ajax": {
"dataType": 'json',
"contentType": "application/json; charset=utf-8",
"type": "POST",
"url": "index.aspx/Risky",
"data": function (d) {
 return "{FileName:" + result+ "}";

},
"dataSrc": function (json) {
   return $.parseJSON(json.d);
}
},
"columns": [
{ "data": "Prctice_Group_Risk_No" },
{ "data": "Practice_Group" },
{ "data": "Risk_Category" },
]
});
}