更新查询到订单头寸记录表

时间:2018-06-30 09:06:11

标签: jquery html mysql ajax

我有Z像这样的表:

 id |  data  | order |
----+--------+--------
 31 |    a   |   0   |
 32 |    b   |   1   |
 33 |    c   |   2   |

,我使用table-dragger.min.js设置头寸行以更新订单。如何创建更新查询以使用Ajax更新订单

var el = document.getElementById('table');
var dragger = tableDragger(el, {
  mode: 'row',
  dragHandler: '.move',
  onlyBody: true,
  animation: 300
});
dragger.on('drop', function() {
  arr = [];
  tbl = $('table tbody > tr');
  tbl.each(function(index) {
    arr[index] = this.id;
  });

  $('textarea').text(arr)

});
table {
  border-collapse: collapse;
}

table,
th,
td {
  border: 1px solid black;
  text-align: center;
}

th:nth-child(1) {
  width: 50px;
}

th:nth-child(2) {
  width: 200px;
}

.move:hover {
  cursor: pointer
}

textarea {
  width: 300px
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/sindu12jun/table-dragger/master/dist/table-dragger.min.js"></script>
<table id="table">
  <thead>
    <tr>
      <th>no</th>
      <th>col</th>
    </tr>
  </thead>
  <tbody>
    <tr id="31">
      <td class="move"> id 31</td>
      <td class="move">a</td>
    </tr>
    <tr id="32">
      <td class="move">id 32</td>
      <td class="move">b</td>
    </tr>
    <tr id="33">
      <td class="move">id 33</td>
      <td class="move">c</td>
    </tr>
  </tbody>
</table>

<br>
index after move position by row id  
<br>
<textarea></textarea>

0 个答案:

没有答案