jQuery datatable：jQueryデータテーブルの次のページにあるデータベースから次の25行をフェッチする

Question

jQueryデータテーブルにデータを格納するための膨大な数のデータがあります。私はmysqlデータベースを使用しています。 angularJsではjQueryデータテーブルを初めて使用することは可能ですか？初めて25レコードのみが抽出され、データテーブルに表示されます。次または2ボタンをクリックすると、次に25レコードが抽出されて表示されます。

以下は、角度コントローラのデータテーブルのコードです。

 $($scope.getDataPointDetails = function() { 

     dataPointFactory.getDataPointDetails().then(
      function (response) { 
       for (var i = 0; i < response.data.length; i++) 
       { 
        dataPointData[i] = new Array(
         '<i class="material-icons waves-effect" onclick="editDataPoint('+ i +');" data-toggle = "tooltip" data-placement = "left" title = "Edit">edit</i> \n\ 
          <i class="material-icons waves-effect" onclick="DeleteDataPoint('+ i +');" data-toggle = "tooltip" data-placement = "left" title = "Delete">delete</i>',       
         response.data[i].companyName, //1 
         (response.data[i].addressLine1+', '+((response.data[i].addressLine1!==null)?response.data[i].addressLine1:'')+', '+response.data[i].city+'-'+response.data[i].pinCode), //2 
         response.data[i].state, //3 
         response.data[i].contactNos, //4 
         response.data[i].tollFreeNo, //5 
         response.data[i].compEmail, // 6 
         response.data[i].compWebsite, //7 
         response.data[i].level1, //8 
         response.data[i].level2, //9 
         response.data[i].level3, //10 
         response.data[i].remark1, //11 
         response.data[i].remark2, //12 
         response.data[i].remark3, //13 
         response.data[i].ptc1, //14 
         response.data[i].ptc2, //15 
         response.data[i].ptc3, //16 
         response.data[i].ptc4, //17 
         response.data[i].ptc5, //18 
         response.data[i].tallySrNo, //19 
         response.data[i].tallyProdType, //20 
         response.data[i].noOfUsers, //21 
         response.data[i].tallyDuration, //22 
         response.data[i].tallyStartDate, //23 
         response.data[i].tallyEndDate, //24 
         response.data[i].drn,//25 
         response.data[i].addressLine1,//26 
         response.data[i].addressLine2, //27 
         response.data[i].city, //28 
         response.data[i].pincode //29 
         ); 
       } 

       $('#dataPointViewTable').dataTable({ 
        "destroy": true, 
        "aaSorting": [], 
        "deferRender": true, 
        "responsive": true, 
        "aaData": dataPointData, 
        "bAutoWidth": false, 
//      "fixedColumns": { 
//       leftColumns: 1, 
//       rightColumns: 1 
//      }, 
        "processing": true, 
        "serverSide": true, 
        "aoColumns": [ 
         {"sTitle": "Action", "sWidth": "5%"}, 
         {"sTitle": "Company Name", "sWidth": "5%"}, 
         {"sTitle": "Address", "sWidth": "15%"}, 
         {"sTitle": "State", "sWidth": "8%"}, 
         {"sTitle": "Contact Number", "sWidth": "10%"}, 
         {"sTitle": "Toll Free Number", "sWidth": "10%"}, 
         {"sTitle": "Email Address", "sWidth": "15%"}, 
         {"sTitle": "Website", "sWidth": "15%"}, 
         {"sTitle": "Level1", "sWidth": "15%"}, 
         {"sTitle": "Level2", "sWidth": "15%"}, 
         {"sTitle": "Level3", "sWidth": "15%"}, 
         {"sTitle": "Remark1", "sWidth": "15%"}, 
         {"sTitle": "Remark2", "sWidth": "15%"}, 
         {"sTitle": "Remark3", "sWidth": "15%"}, 
         {"sTitle": "Contact Person 1(Name, Designation, Email, Mobile No.)", "sWidth": "15%"}, 
         {"sTitle": "Contact Person 2(Name, Designation, Email, Mobile No.)", "sWidth": "15%"}, 
         {"sTitle": "Contact Person 3(Name, Designation, Email, Mobile No.)", "sWidth": "15%"}, 
         {"sTitle": "Contact Person 4(Name, Designation, Email, Mobile No.)", "sWidth": "15%"}, 
         {"sTitle": "Contact Person 5(Name, Designation, Email, Mobile No.)", "sWidth": "15%"}, 
         {"sTitle": "Tally Serial No", "sWidth": "15%"}, 
         {"sTitle": "Product Type", "sWidth": "15%"}, 
         {"sTitle": "No of Users", "sWidth": "15%"}, 
         {"sTitle": "Duration", "sWidth": "15%"}, 
         {"sTitle": "TSS Purshase Date", "sWidth": "15%"}, 
         {"sTitle": "TSS Expiry Date", "sWidth": "15%"}] 
       }); 

      }); 
    }); 

データテーブルにサーバー側処理オプションを追加しました。私はネットワーク上で見ることができる$ httpの応答を得ていますが、テーブルでは表示できません。また、データテーブル用のポップアップアラートメッセージが表示されています。 DataTables警告：table id = dataPointViewTable - Ajaxエラー。このエラーの詳細については、serverSideオプションを使用してserver-side processingを有効にしてください。http://datatables.net/tn/7

Answer 1

を参照してください。

サーバ側でソート、フィルタリング、ページネーションを処理する独自のサーバサイドスクリプトを作成します。 DataTablesにはssp.class.phpが付属しています。選択した言語がPHPの場合に役立ちます。