jquery-datatable لا يعرض جميع الإدخالات ولا يعمل ajax على جانب الخادم؟

Question

في المجمل، لدي 11 سجلاً، لكن الجدول يعرض 10 إدخالات فقط.ويعرض أيضًا "إظهار 1 إلى 10 من أصل 10 إدخالات"، ولكن هناك 11 إدخالاً."الزر التالي" أيضًا لا يعمل.ما هو الخطأ هنا؟الرجاء المساعدة.كما يؤدي تمكين جانب الخادم إلى aData is undefined خطأ بشكل غريب ، إذا كان التعليق "bserverside":صحيح"، فهو يعمل بشكل جيد ويتم عرض الجدول الخاص بي بشكل جيد بتنسيق HTML ولكن ليس كل السجلات.

يبدو كائن JSON الذي تم إرجاعه من الخادم جيدًا وفقًا للتنسيق.لديها aaData (لقد خفضت aaData أدناه للتبسيط)

{ "iTotalRecords": 11, "aaData": [[ .....], [....]], "sEcho": 0, "iTotalDisplayRecords": 11}

هنا هو الكود الخاص بي:

<script type="text/javascript">
$(document).ready(function() {
var oTable = $('#search_table').dataTable( {
        "sDom": 'T<"clear">lrtip',
        "bProcessing": true,
        //"bServerSide": true,
        "sAjaxSource": "{% url 'search_list_json' %}",
        "aaSorting": [ [2,'asc'], [1,'desc'] ],
        // Disable sorting for the Actions column.
        "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0,4 ] } ],
        "iDisplayLength":50
    } );
} );
</script>

لغة البرمجة:

<div class="container">
    <div class="row">
      <div class="col-sm-12 col-md-12">
        <div class="well">
          <table id="search_table">
            <thead>
              <th width="15%">
                <center>Title</center>
              </th>
              <th width="10%">Date Created</th>
              <th width="10%">Min Price</th>
              <th width="10%">Max Price</th>
              <th width="10%"></th>
            </thead>
            <tbody></tbody>
          </table>
          <br>
        </div>
      </div>
    </div>
  </div>

مع تعليق الجانب المقطوع، فإنه يعمل بشكل جيد؛الموضح أدناه (لكن يتم عرض 10 سجلات فقط)

مع التعليق من جانب الخادم، لا يتم تحميل أي بيانات (يظهر لي الخطأ الموضح أعلاه في وحدة التحكم).

Answer 1

لقد استخدمت هذا في مشروع جانغو الخاص بي.هنا هو الكود الخاص بي.حاول إذا كان هذا يعمل

<script src="{% static "js/scripts.js" %}"></script>
<script type="text/javascript">
$(document).ready(function() {
var oTable = $('#search_table').dataTable( {
        "sDom": 'T<"clear">lrtip',
        "oTableTools": {
            "sSwfPath": "{% static 'extras/copy_csv_xls_pdf.swf' %}",
            "aButtons": [ "csv", "pdf", "print" ],
        },
        "bProcessing": true,
        "bServerSide": true,
        "bStateSave": true,
        "sAjaxSource": "{% url 'search_list_json' %}",
        // Disable sorting for the Actions column.
        "aaSorting": [ [1,"desc" ]],
        //'aLengthMenu':[[35,'-1'],['Paged','All']],
        "iDisplayLength":10,
        "sPaginationType": "full_numbers",
        //"sPaginationType": "bs_full",
        "oLanguage": {
            "oPaginate":{
                "sFirst":'<<',
                "sLast": '>>',
                "sNext": '>',
                "sPrevious": '<'
                },

            "sInfo":'{{ "Showing _START_ to _END_ of _TOTAL_ entries" }}',
            "sZeroRecords": "No data to show"
            },
            "aoColumns": [
            { "sClass": "center","bSortable": false  },
            { "sClass": "center","bSortable": true },
            { "sClass": "center","bSortable": true },
            { "sClass": "center","bSortable": true },
            { "sClass": "center","bSortable": false}
        ]
    } );
} );
</script> 

Answer 2

    $("#tableId").dataTable({
    "bPaginate": true,
    "bJQueryUI" : true,
    "sPaginationType" : "full_numbers",
    "oLanguage" : {
        "sInfo" : "Showing _START_ to _END_ of _TOTAL_ items",
        "sInfoEmpty" : "Showing 0 to 0 of 0 items",
        "sInfoFiltered" : " - filtering from _MAX_ items",
        "sEmptyTable" : "No Rules available"
    },      
    "bSort" : false,
    "bFilter" : false,
    "iDisplayLength": 50
});

=====================================================================
استخدم الطريقة المذكورة أعلاه لتهيئة الجدول.سيؤدي تعيين علامة bPaginate إلى صحيح إلى تمكين الزر التالي في جدول البيانات، حتى تتمكن من عرض السجل الحادي عشر المفقود.:)