2

私は、テーブルを構築するための多くの情報のデータベースを持っています。私ができるようにしたいのは、ajax呼び出しでデータをロードし、テーブルのデータを編集できることです。しかし、私はページに表示されるデータを取得することはできません。私は別のインターフェイスでDataTablesを使用しています。ローディング、並べ替え、その他のクールな機能が動作します。私は前にエディタを使用していないし、少し混乱している。Editor from DataTablesとajaxからデータを呼び出す方法

function drawDataTable(){ 
    var len = allocationData.length; 
    html = "<div id='dataTableDiv'><table id='dataTable' class='table table-bordered table-striped dataTable' role='grid'><thead><tr role='row'><th>System Name</th><th>Gatherer</th><th>Operator</th><th>County</th><th>Sample Date</th><th>Daily Avg</th></tr></thead><tbody>"; 
    for (i=0;i<len;i++){ 
    html += "<tr><td>" + allocationData['SystemName'][i] + "</td><td>" + allocationData['Gatherer'][i] + "</td><td>" + allocationData['Operator'][i] + "</td><td>" + allocationData['County'][i] + "</td><td>" + allocationData['SampleDate'][i] + "</td><td>" + allocationData['DailyAvg'][i] + "</td></tr>"; 

    } 
    html += "</tbody></table></div>"; 

    $(".table-responsive").html(html); 
} 

$(function(){ 
    editor = new $.fn.dataTable.Editor({ 
    "ajax": "qry/dataTable.php", 
    "table": "#dataTable", 
    "fields":[{ 
     "name": "SystemName" 
    },{ 
     "name": "Gatherer" 
    },{ 
     "name": "Operator" 
    },{ 
     "name": "County" 
    },{ 
     "name": "SampleDate" 
    },{ 
     "name": "DailyAvg" 
    }] 
}); 

$('#dataTable').DataTable({ 
    dom: "Bfrtip", 
    ajax: { 
     type: "POST", 
     url: "qry/dataTable.php", 
     success: function(){ 
      drawDataTable(); 
     } 
    }, 
    serverSide: true, 
    columns: [ 
     {data: "SystemName"}, 
     {data: "Gatherer"}, 
     {data: "Operator"}, 
     {data: "County"}, 
     {data: "SampleDate"}, 
     {data: "DailyAvg"} 
    ], 
    select: true, 
    buttons: [ 
     { extend: "create", editor: editor }, 
     { extend: "edit", editor: editor }, 
     { extend: "remove", editor: editor } 
    ] 
    }); 
}); 

答えて

2

あなたの成功:機能を編集してみてください。これが役立つかどうかを見てください。

 success: function(result){ 
      allocationData = JSON.parse(result); 
      drawDataTable(); 
     } 
+0

私はそれを試みましたが、ページには何も読み込まれません。 – JBaldwin

関連する問題