2

我有一个包含大量信息的数据库,用于构建表格。我想要做的是通过 ajax 调用加载数据,然后能够编辑表中的数据。但我无法让数据显示在页面上。我在另一个界面中使用 DataTables,加载、排序和其他很酷的功能都可以工作。我以前没有使用过编辑器,我有点困惑。

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 }
    ]
  });
});
4

1 回答 1

2

尝试编辑你的成功:函数。看看这是否有帮助。

        success: function(result){
            allocationData = JSON.parse(result);
            drawDataTable();
         }
于 2016-12-08T18:02:40.020 回答