Question posted in
You can find the official documentation here.

Passing parameters to AJAX for binding DataTable is not working – Jquery ajax

I want to use jQuery DataTable plugin for pdf, excel, sorting etc.. for using all these features

I want to filter record from table, for that I am passing some parameters from client side JSON>stringfy(My_Prametrs) to WebMethod, And method filtering the data and returning back to client in JSON format but it’s not able to bind with table why so?

And If I am using parameterless method it’s working as expected able to bind table

In simple word

Parameterless method working perfectly but those method which holds parameters not working why?

AJAX

function LoadTableData() {
  var params = {
    //UserName: "@xc", UserID: "@xc", Status: "InActive"
    UserName: $('#txtUserName').val(),
    UserID: $('#txtUserID').val(),
    Status: $('input[name="Status"]:checked').val()
  };
  $.ajax({
    url: 'UserService.asmx/Get_Data',
    method: 'post',
    data: JSON.stringify(params),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    success: function(data) {
      $('#example').dataTable({
        data: data /*JSON.parse(data)*/ ,
        columns: [{
          /*My columns */
        }],
        dom: 'Bfrtip',

        buttons: [
          'copy', 'csv', 'excel', 'pdf'
        ],
        "searching": true,
        "paging": true,
        "info": true,
        "language": {
          "emptyTable": "No data available"
        },
      })
    },
    error: function(err) { // Added this event to capture the failed requests.
      console.log(err.responseText);
    }
  });

Sever side Web Method

[WebMethod]
public void Get_Data(string UserName, string UserID, string Status)
{
  DataTable dt_MobileUserLogin = FAV_VS_BLL.Search_MobileUserLogin(UserName, UserID, Status);
    List<MobileUserMaster> list = new List<MobileUserMaster>();

    foreach (DataRow dr in dt_MobileUserLogin.Rows)
    {
        list.Add(new MobileUserMaster
        {
            USER_LOGIN = dr["USER_LOGIN"].ToString(),
            USER_NAME = dr["USER_NAME"].ToString(),
            Status = dr["status"].ToString(),
            PASSWORD = dr["PASSWORD"].ToString()
        });
    }
    JavaScriptSerializer jss = new JavaScriptSerializer();
    //return jss.Serialize(list);
    Context.Response.Write(jss.Serialize(list));

}

MobileUserMastr Class

public class MobileUserMaster
    {
        public string PASSWORD { get; set; }
        public string USER_LOGIN { get; set; }
        public string USER_NAME { get; set; }
        public string Status { get; set; }
    }

I am not getting a valid JSON

i am getting JSON like

[{
    "PASSWORD": "123",
    "USER_LOGIN": "@xc",
    "USER_NAME": "@xc",
    "Status": "Inactive"
}] {
    "d": null
}

What am I doing wrong?

Kindly help me I am stuck on this problem since one week

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Thanks all:

    I just change my class to :

    public class MobileUserMaster
    {
        public MobileUserMaster() { }
        public string PASSWORD { get; set; }
        public string USER_LOGIN { get; set; }
        public string USER_NAME { get; set; }
        public string Status { get; set; }
    }

    And since i was getting

    {
"d": null
}

    So We have to clear the default response {d:null} from ASP.NET Webservice before giving the response on the server side by using Context.Response.Clear() and set the contentType

    I used bellow code to serialize :

    Context.Response.Clear();
Context.Response.ContentType = "application/json";
Context.Response.AddHeader("content-length", stringJSON.Length.ToString());
Context.Response.Flush();
Context.Response.Write(stringJSON);
HttpContext.Current.ApplicationInstance.CompleteRequest();

    And its start working


  2. 0

    Try to replace

    var params = {
    UserName: $('#txtUserName').val(),
    UserID: $('#txtUserID').val(),
    Status: $('input[name="Status"]:checked').val()
  };
  $.ajax({
    url: 'UserService.asmx/Get_Data',
    method: 'post',
    data: JSON.stringify(params),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
 success: function(data) {

    with

    var userData = {
     UserName: $('#txtUserName').val(),
    UserID: $('#txtUserID').val(),
    Status: $('input[name="Status"]:checked').val()
  };

  $.ajax({
    url: '/UserService.asmx/Get_Data',
    method: 'POST',
    data: userData,
 success: function(data) {

    and try this to serialize:

     var jss = new JavaScriptSerializer();
  var json= jss.Serialize(list);
 context.Response.ContentType = "text/json";
context.Response.Write(json);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search