2016-08-26 9 views
2

私はこのJavaScriptコードを持っています。 DataTablesのオーバーライドエラー

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css"> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.1/css/buttons.dataTables.min.css"> 
 

 
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.3.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/buttons/1.2.1/js/dataTables.buttons.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script> 
 

 
<script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js 
 
"></script> 
 
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/buttons/1.2.1/js/buttons.html5.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/buttons/1.2.1/js/buttons.colVis.min.js"></script> 
 
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/buttons/1.2.1/js/buttons.print.min.js"></script> 
 

 
<script type="text/javascript" language="javascript" class="init"> 
 

 
$(document).ready(function() { 
 
    function getNameSpecsSize(data, type, dataToSet) { 
 
     return data[3] + ", " + data[4] + ", " + data[5]; 
 
    } 
 

 
    function getWOandSheet(data, type, dataToSet) { 
 
     return data[10] + "/" + data[11]; 
 
    } 
 
    
 
    var table = $('#material_used').dataTable({ 
 
     "aProcessing": true, 
 
     "aServerSide": true, 
 
     "scrollY": 350, 
 
     "scrollX": true, 
 
     "deferRender": true, 
 
     "sAjaxSource": "Scripts/server-response-mat-used.php", 
 
     "fnServerData": function (sSource, aoData, fnCallback, oSettings) { 
 
      oSettings.jqXHR = $.ajax({ 
 
       "dataType": 'json', 
 
       "type": "POST", 
 
       "url": sSource, 
 
       "data": aoData, 
 
       "success": fnCallback, 
 
       "error": function() { 
 
        alert('No data available/No matching records found'); 
 
        window.history.back(); 
 
       } 
 
      }) 
 
     }, 
 
     "aoColumns": [ 
 
       {"data": "1", "sClass": "align_center"}, 
 
       {"data": "2", "sClass": "align_center"}, 
 
       {"data": getNameSpecsSize, "sClass": "align_center"}, 
 
       {"data": "6", "sClass": "align_center"}, 
 
       {"data": "7", "sClass": "align_center"}, 
 
       {"data": "8", "sClass": "align_center"}, 
 
       {"data": "9", "sClass": "align_center"}, 
 
       {"data": getWOandSheet, "sClass": "align_center"}, 
 
       { "mData": null , //its null here because history column will contain the mRender 
 
       "mRender" : function (data, type, full) { 
 
        return '<a href="link.php?c='+data[0]+'">Edit</a>/<a href="link.php?c='+data[0]+'">Delete</a>';} 
 
       } 
 
      ], 
 
     "aaSorting": [[0,'desc']], 
 
     dom: 'Bfrtip', 
 
     lengthMenu: [ 
 
      [ -1 ], 
 
      [ 'Show all' ] 
 
     ], 
 
     buttons: [ 
 
      'pageLength', 
 
      'print', 
 
      'copyHtml5', 
 
      'excelHtml5', 
 
      'csvHtml5', 
 
      'pdfHtml5', 
 
      'colvis' 
 
     ] 
 
    }); 
 
}); 
 

 
</script>
<style type="text/css"> 
 
    .align_right { text-align: right; } 
 
    .align_center { text-align: center; } 
 
</style>
<table id="material_used" class="display" cellspacing="0" width="100%"> 
 
<thead> 
 
<tr> 
 
    <th width="10%"><div align="center"><font size="2">A</font></div></th> 
 
    <th width="8%"><div align="center"><font size="2">B</font></div></th> 
 
    <th width="15%"><div align="center"><font size="2">C, D, E</font></div></th> 
 
    <th width="3%"><div align="center"><font size="2">F</font></div></th> 
 
    <th width="10%"><div align="center"><font size="2">L</font></div></th> 
 
    <th width="15%"><div align="center"><font size="2">G</font></div></th> 
 
    <th width="15%"><div align="center"><font size="2">H</font></div></th> 
 
    <th width="15%"><div align="center"><font size="2">I/J</font></div></th> 
 
    <th width="10%"><div align="center"><font size="2">K</font></div></th> 
 
</tr> 
 
</thead> 
 
</table>
は私が データなしエラーメッセージを表示するように作られた/一致するレコードは、ローカルホストサーバでは認められなかったが、私は自分のサーバー上のコードを実行すると、エラーが表示されません。

ご協力いただければ幸いです。

よろしくお願いいたします。

+0

あなたはAJAXリクエストが発射されていることを確認したことがありますか?これを行う1つの方法は、ブラウザのF12開発ツールを見ることです。ネットワークタブを見て、POSTがURLに送信されていることを確認します。 –

+0

@devlincarnateはい、絶対に。 POSTがURLに送信されます。結果がnullであることがわかります。結果がnull/errorの場合はコードに追加してメッセージを表示します。 localhostサーバー内でエラーが表示されますが、サーバーにファイルをアップロードした後もエラーは表示されませんが、POSTはURLに送信されます。 –

答えて

0

は私のサーバーでは動作しませんでしたfnServerDataのDataTable のように思えるので、私はAJAXページがロードされるときに、URLの応答がヌルに私に応答を与えているかどうかを確認するコード/準備に付属しました。

ので、ここでのコードです:

$(document).ready(function() { 
 
$.ajax({ 
 
     type: "POST", 
 
     url: "server-response.php", 
 
     cache: false, 
 
     success: function(response){ 
 
      console.log(response); 
 
      if (response == "null"){ 
 
       alert('No data available/No matching records found'); 
 
        window.history.back(); 
 
      } 
 
     } 
 
    }); 
 
});

ページの準備が整うと、スクリプトはPOSTリクエストを送信し、URLからの応答を読み込みますが。私はヌル応答を取得した場合、警告ダイアログがポップアップ表示されますと、ページがDataTableのは、AJAXを送信する前に、前のページに自動的にリダイレクトして、私はコードで使用したのと同じURLにJSONレスポンス(NULLである)ので、エラーメッセージを読みますDataTablesからは表示されません。