jQuery Datatable: разбиение на страницы и фильтр не отображается правильно

Question

Я не знаю, как это решить, попробуйте целый день, но не удалось исправить разбиение на страницы. Я использую jQuery datatable, и для отображения моих огромных данных я использую серверную часть.

В качестве тестирования вызывайте только 10 строк данных в таблицу. Затем перед переходом к таблице я перестроил данные внутри dataSrc, используя этот solution. Дисплей таблицы успешно отображается, но отображение страниц и фильтр отображаются неправильно.

Может кто-нибудь помочь в этом.

Ниже приведен мой код.

AJAX

$('#example').DataTable({ 
    "processing": true, 
    "serverSide": true, 
    "ajax": { 
    type: "POST", 
    contentType: "application/json; charset=utf-8", 
    url: "datatables.aspx/GetData", 
    'data': function (data) { 
     return JSON.stringify(data); 
    }, 
    "dataSrc": function (data) { 
     var json = $.parseJSON(data.d); 

     var myData = {}; 
     myData.draw = parseInt(json.otherData[0].draw); 
     myData.recordsTotal = parseInt(json.otherData[0].recordsTotal); 
     myData.recordsFiltered = parseInt(json.otherData[0].recordsFiltered); 
     myData.data = json.searchData; 

     return myData.data; 
    } 
    }, 
    "columns": [ 
     { "data": "Username" } 
    ] 
    } 
}); 

C#

[WebMethod] 
[ScriptMethod(UseHttpGet = false)] 
public static string GetData(int draw, object columns, object order, int start, int length, object search) 
{ 
    string constr = ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString; 
    using (SqlConnection con = new SqlConnection(constr)) 
    { 
     string mySql = "SELECT TOP 10 username AS Username FROM user_lookup"; 
     using (SqlCommand cmd = new SqlCommand(mySql, con)) 
     { 
      using (SqlDataAdapter sda = new SqlDataAdapter(cmd)) 
      { 
       con.Open(); 
       DataSet ds = new DataSet(); 
       sda.Fill(ds, "searchData"); 

       DataTable newDT = new DataTable("otherData"); 

       //Add columns to DataTable. 
       newDT.Columns.AddRange(new DataColumn[4] { 
        new DataColumn("draw"), 
        new DataColumn("recordsTotal"), 
        new DataColumn("recordsFiltered"), 
        new DataColumn("userRole") 
       }); 

       //Add rows to DataTable. 
       newDT.Rows.Add(draw, length, start, "myrole"); 
       ds.Tables.Add(newDT); 

       string JSONString = string.Empty; 
       JSONString = JsonConvert.SerializeObject(ds); 
       return JSONString; 
      } 
     } 
    } 
} 

Это данные я вернуться обратно в DataTable к структурированной таблицы.

Фильтр данных и разбиение на страницы не верны, должно быть только 1 страница разбивки на страницы.

Answer 1

У меня есть решение для нашего случая. Вы должны напрямую изменить объект своего ответа.

"dataSrc": function (data) { 
     var json = $.parseJSON(data.d); 

     data.draw = parseInt(json.otherData[0].draw); 
     data.recordsTotal = parseInt(json.otherData[0].recordsTotal); 
     data.recordsFiltered = parseInt(json.otherData[0].recordsFiltered); 
     data.data = json.searchData; 

     return data.data; 
    } 

Надеюсь, он работает в вашем случае.

Answer 2

Ваш ответ не содержит свойств otherData и searchData и вы получаете доступ к данным по этим именам.

Ваш ответ - простой объект со следующими свойствами.

• data
• recordsTotal
• recordsFiltered
• draw

Так что вам нужно, чтобы получить доступ к ним непосредственно из вашего ответа, как этот

var myData = {}; 
myData.draw = parseInt(json.draw); 
myData.recordsTotal = parseInt(json.recordsTotal); 
myData.recordsFiltered = parseInt(json.recordsFiltered); 
myData.data = json.data; 

Также recordsTotal должно быть total номер records прямо сейчас вы возвращаетесь 10, а также показаны также 10.

Вы получаете NaN, потому что нет собственности json.otherData[0].recordsFiltered поэтому, когда вы измените его на json.recordsFiltered, он покажет numbers.