Question

我正在尝试使用AJAX调用的JSON格式的数据构建一个可编辑的表。为此，我使用Datatables插件和Free Datatables Editor（kingkode.com/free-datatables-editor-alternative/）。我不能使用Datatables Editor，因为我只能使用开源的库。

目前我只使用自己的simpleHTTPserver来提供JSON，这就是链接指向localhost的原因。

该表最初显示了正确的数据，但我无法编辑/创建/删除任何元素，因为所选行的值似乎未定义，并且在确认/提交时提供错误。

错误图片：

删除 - 似乎未定义值

创建 - 错误消息

我不明白我错过了什么或做错了什么，所以任何可以让我走上正轨的帮助都会很棒！

脚本：

    $(document).ready(function() {

var columnDefs = [{
    title: "NTP Servers",
    data: "ntp_server"
  }];

//Table creation
var myTable = $('#testTableData').dataTable({
  "ajax": "http://localhost:6112/data.php",
  columns: columnDefs,
    dom: 'Bfrltip',        
    select: 'single',
    responsive: true,
    altEditor: true,     
    buttons: [{
            text: 'Create',
            name: 'add'        
          },
          {
            extend: 'selected', 
            text: 'Edit',
            name: 'edit'        
          },
          {
            extend: 'selected', 
            text: 'Delete',
            name: 'delete'      
          },]
        });
});

HTML：

  <form id="fe">
    <div class="container">

      <h1>Data Table - Network/Time</h1>
      <table class="dataTable table table-striped" id="testTableData">
      </table>

    </div>
  </form>

JSON数据示例：

{
    "data": [{
        "DT_RowId": 0,
        "ntp_server": "1.openwrt.pool.ntp.org"
    }, {
        "DT_RowId": 1,
        "ntp_server": "2.openwrt.pool.ntp.org"
    }, {
        "DT_RowId": 2,
        "ntp_server": "3.openwrt.pool.ntp.org"
    }]
}

我包括的图书馆：

 <script src="libs/js/jquery.js"></script>
  <script src="libs/js/bootstrap.min.js"></script>
  <script src="libs/js/jquery.dataTables.min.js"></script>
  <script src="libs/js/dataTables.bootstrap.min.js"></script>
  <script src="libs/Buttons-1.2.2/js/dataTables.buttons.min.js"></script>
  <script src="libs/Buttons-1.2.2/js/buttons.bootstrap.min.js"></script>
  <script src="libs/Select-1.2.0/js/dataTables.select.min.js"></script>
  <script src="libs/js/altEditor/dataTables.altEditor.free.js"></script>

Answer 1

我检查了dataTables.altEditor.free.js中的代码，发现你确实应该使用数组数组作为数据，否则它将无法工作。所以有两种方式可供选择：

重写dataTables.altEditor.free.js
重新构建您的数据，例如：http://jsfiddle.net/rmcmaster/bbLjzspf/22/

无法使用数据表和自由编辑器编辑/创建/删除表中的元素

1 个答案: