Наполнение Jquery DataTables с Webservice

Question

я создал веб-сервиса в Asp.net, который возвращает следующие

<string xmlns="http://tempuri.org/">[{"Id":13,"FirstName":"Mohsin","LastName":"Mustufa","Birthday":"12/11/1990","Phone":null,"Email":"abcd@yahoo.com","UserId":"11"}] 

теперь я хочу, чтобы заполнить эти данные в JqueryDatatable

здесь является HTML

<table id="example" class="display" cellspacing="0" width="100%"> 
    <thead> 
     <tr> 
      <th>Id</th> 
      <th>FirstName</th> 
      <th>LastName</th> 
      <th>Birthday</th> 
      <th>Phone</th> 
      <th>Email</th> 
      <th>UserId</th> 
     </tr> 
    </thead> 

    <tfoot> 
     <tr> 
      <th>Id</th> 
      <th>FirstName</th> 
      <th>LastName</th> 
      <th>Birthday</th> 
      <th>Phone</th> 
      <th>Email</th> 
      <th>UserId</th> 
     </tr> 
    </tfoot> 
</table> 

Jquery

$.ajax({ 
type: 'POST', 
url: 'ws.asmx/ContactsList', 
data: "{}", 
contentType: "application/json; charset=utf-8", 
dataType: "json", 
success: function (data) { 
    //alert(data.d); 
    $('#example').dataTable({ 
     "aaData": data.d, 
     "aoColumns": [ 
      { 
       "mDataProp": "Id" 
      }, { 
       "mDataProp": "FirstName" 
      }, { 
       "mDataProp": "LastName" 
      }, { 
       "mDataProp": "Birthday" 
      }, { 
       "mDataProp": "Phone" 
      }, { 
       "mDataProp": "Email" 
      }, { 
       "mDataProp": "UserId" 
      } 
     ] 
    }); 
}}); 

здесь data.d показывает следующее, когда console.log называется

[{"Id":13,"FirstName":"Mohsin","LastName":"Mustufa","Birthday":"12/11/1990","Phone":null,"Email":"abcd@yahoo.com","UserId":"11"}] 

вебсервис

[WebMethod] 
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
    public string ContactsList() 
    { 

     var contacts = new List<ContactsModel>(); 
     var conn = ConfigurationManager.ConnectionStrings["AccountsConnectionString"].ConnectionString; 
     using (var con = new SqlConnection(conn)) 
     { 
      con.Open(); 
      const string query = "SELECT [Id], [F_name], [L_name], [Phone], [Birthday], [Email], [User_id] FROM [Contacts]"; 
      var cmd = new SqlCommand(query, con); 
      var reader = cmd.ExecuteReader(); 
      while (reader.Read()) 
      { 
       var model = new ContactsModel(); 
       model.Id = Convert.ToInt32(reader["Id"].ToString()); 
       model.FirstName = reader["F_name"].ToString(); 
       model.LastName = reader["L_name"].ToString(); 
       model.Birthday = reader["Birthday"].ToString(); 
       model.Email = reader["Email"].ToString(); 
       model.UserId = reader["User_id"].ToString(); 
       contacts.Add(model); 
      } 
     } 
     return new JavaScriptSerializer().Serialize(contacts); 
    } 

Ошибка

Request Unknown parameter 'Id' for Row 0 

Answer 1

Похоже, что данные, возвращаемые веб-службой, интерпретируются как строка. Попробуйте использовать JSON.parse (data.d)

http://plnkr.co/edit/JGzCNT6Zg73xtFwAUuOx?p=preview

$(document).ready(function() { 
    var data = { 
     d : '[{"Id":13,"FirstName":"Mohsin","LastName":"Mustufa","Birthday":"12/11/1990","Phone":null,"Email":"abcd@yahoo.com","UserId":"11"}]' 
    }; 
    $('#example').dataTable({ 
     "aaData": JSON.parse(data.d), 
     "aoColumns": [ 
      { 
       "mDataProp": "Id" 
      }, { 
       "mDataProp": "FirstName" 
      }, { 
       "mDataProp": "LastName" 
      }, { 
       "mDataProp": "Birthday" 
      }, { 
       "mDataProp": "Phone" 
      }, { 
       "mDataProp": "Email" 
      }, { 
       "mDataProp": "UserId" 
      } 
     ] 
    }); 

});