PHP JsonオブジェクトからJQuery DataTablesにデータを取り込みます。

ajaxを使用してテーブル（DataTables.net）を設定しようとしています。受け取った値は、私のPHPスクリプトによって生成されたjsonオブジェクトからのものです。現時点では、私は古典的な方法を使用してそれを管理することができます、PHPからのヴァルスが、私は今jsonメソッドに切り替えるしたい。ここでPHP JsonオブジェクトからJQuery DataTablesにデータを取り込みます。

iは任意の成功なしに多くのものをテストしてきた私のjsfiddleです：

$(document).ready(function() { 
 
    $('#example').DataTable({ 
 
    "bProcessing": true, 
 
     "ajax": { 
 
     "url": "http://www.json-generator.com/api/json/get/bUCyQgmGeW?indent=2", 
 
     "dataSrc": "syncok" 
 
     }, 
 
     "columns": [ 
 
     { "data": "Ticket_RT" }, 
 
     { "data": "Last_up_time" }, 
 
     { "data": "Last_down_time" }, 
 
     { "data": "Date_du_Diag" }, 
 
     { "data": "Commentaire_FT" }, 
 
     { "data": "Code_Retour_FT" }, 
 
     { "data": "Supprimer" } 
 
     ] 
 
    }); 
 
});

body { 
 
    font-family: "Open Sans", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; 
 
}

<script src="https://code.jquery.com/jquery-1.12.3.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
 

 

 
<div id="exampleDiv">hello</div> 
 
<table width="100%" class="display" id="example"> 
 
    <thead> 
 
    <tr> 
 
     <th>Ticket RT</th> 
 
     <th>Last up time</th> 
 
     <th>Date du Diag RT</th> 
 
     <th>Commentaire FT</th> 
 
     <th>Code Retour FT</th> 
 
     <th>Supprimer</th> 
 
    </tr> 
 
    </thead> 
 
</table>

\私は誰かがこの問題で私を助けることを願って、私はstackoverflowのから多くのスニペットを試してみましたし、元のドキュメントから、私は自分でそれを管理することはできません！

ありがとう：

よろしくお願いします。

EDIT：

あなたが.DataTable関数の前にこれを追加する必要があり、この問題を修正するには： $("#example").empty();

をそして.DataTable機能にオプション"bDestroy": true,を追加します。このスレッドから

ソリューション：DataTables Forum

EDIT 2：

私は盲目だすみません！今すぐ私のタイトルが.emem（）関数を追加した後に消える... 今私はこの別の問題を解決しようとしているので、もし誰かが私を正しい方法で置くことができます！助けを事前にいただきありがとうございます:)

FIX：

$(document).ready(function() { 
$("#ret_syncok").empty(); 
$('#ret_syncok').DataTable({ 
    "bDestroy": true, 
    "bProcessing": true, 
    "ajax": { 
     "url": "js/optionsTables/cMass_ret_syncok.php", 
     "dataSrc": "syncok" 
    }, 
    "columns": [ 
     { "data": "Ticket_RT" }, 
     { "data": "Last_up_time" }, 
     { "data": "Last_down_time" }, 
     { "data": "Date_du_Diag_RT" }, 
     { "data": "Commentaire_FT" }, 
     { "data": "Code_Retour_FT" }, 
     { "data": "Supprimer" } 
    ], 
    "columnDefs": [ 
     { "title": "Ticket RT", "targets": 0 }, 
     { "title": "Last up time", "targets": 1 }, 
     { "title": "Last down time", "targets": 2 }, 
     { "title": "Date du Diag_RT", "targets": 3 }, 
     { "title": "Commentaire FT", "targets": 4 }, 
     { "title": "Code Retour FT", "targets": 5 }, 
     { "title": "Supprimer", "targets": 6 } 
    ] 
}); 
});

私はAjaxのURLがHTTPSからHTTPではないので、それはJsfiddleで働いていない他の誰か:)

出典

2016-08-23 Peacefull

を助けることを願って、

私のコンピュータで試してみましたが、動作しています。問題は列の名前が同じではありませんでした。列の数が同じではありませんでした。

<html> 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css"/> 
<div id="exampleDiv">hello</div> 
<table width="100%" class="display" id="example"> 
    <thead> 
    <tr> 
     <th>Ticket RT</th> 
     <th>Last up time</th> 
     <th>Last down time</th> 
     <th>Date du Diag RT</th> 
     <th>Commentaire FT</th> 
     <th>Code Retour FT</th> 
     <th>Supprimer</th> 
    </tr> 
    </thead> 
</table> 

</html> 
<script src="https://code.jquery.com/jquery-1.12.3.js" ></script> 
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js" ></script> 
<script> 
$(document).ready(function() { 
    $('#example').DataTable({ 
    "bProcessing": true, 
     "ajax": { 
    "url": "http://www.json-generator.com/api/json/get/bUCyQgmGeW?indent=2", 
    "dataSrc": "syncok" 
     }, 
     "columns": [ 
    { "data": "Ticket_RT" }, 
    { "data": "Code_Retour_FT" }, 
    { "data": "Date_du_Diag_RT" }, 
    { "data": "Last_up_time" }, 
    { "data": "Supprimer" }, 
    { "data": "Last_down_time" }, 
    { "data": "Commentaire_FT" } 
     ] 
    }); 
}); 

</script>

出典

2016-08-23 13:53:32

私はjsonコードに何が起こるのか分かりませんが、私のコンピュータではうまく構成されています。ここにLive DataTablesの別のテストがあります：http://live.datatables.net/panudoro/1/editそれは素晴らしいです。非常に奇妙な。コンソールログからのメッセージエラー： ** TypeError：headerCells [i]が未定義です** – Peacefull

私はJsonの列名は言語の違いによって国によって異なると思います。 –

PHP JsonオブジェクトからJQuery DataTablesにデータを取り込みます。

答えて

関連する問題