Tabledit jquery 插件选择字段不起作用

Question

我尝试了 jquery 的 Tabledit 插件。它工作正常。但是，如果我想将编辑字段设置为选择字段，则它不起作用。编辑字段也显示为文本输入字段而不是选择字段。我做错了什么。

$('#mytable').Tabledit({
  columns: {
    identifier: [0, "id"],
    editable: [
      [1, 'car'],
      [2, 'color', '{"1": "red", "2": "green"}']
    ]
  }
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/jquery.tabledit.min.js"></script>


<table id="mytable">
  <thead>
    <tr>
      <th>id</th>
      <th>Car</th>
      <th>Color</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Ferrari</td>
      <td>Red</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Lotus</td>
      <td>Green</td>
    </tr>
  </tbody>
</table>

Answer 1

我假设您使用的代码运行良好。由于这个问题多年来被多次访问，我想我可能会稍微修改它以节省其他开发人员的时间，以防有人试图通过

AJAX

从数据库中获取数据，并将其直接放在选择 JQuery Table Edit 插件的字段。

fetch("get_data.php").then((response) => {
        if(!response.ok){ // Before parsing (i.e. decoding) the JSON data,
                          // check for any errors.
            // In case of an error, throw.
            throw new Error("Something went wrong!");
        }

        return response.json(); // Parse the JSON data.
    }).then((data) => {
         // This is where you handle what to do with the response.
         var data_ = JSON.stringify(data);
         data_ = "{"+data_.replace(/[{}\[\]]+/g, '')+"}";
         $('#data_table').Tabledit({
            deleteButton: true,
            editButton: true,
            columns: {
              identifier: [0, 'id'],
              editable: [[1, 'car'], [2, 'color', data_]]
            },
            hideIdentifier: true,
            url: 'live_edit.php'
          });
    }).catch((error) => {
         // This is where you handle errors.
         console.log(error);
    });

希望这有帮助。