Ajax 代码将用户数据发送到更新表格编辑行的 php 页面

Question

所以我有这张桌子：

<?php             
  echo '<table id="tableteste" class="table table-striped" width="100%">';
  echo '<thead><tr>';
  echo '<th>Data Chamada</th>';
  echo '<th>Hora Chamada</th>';
  echo '<th>Unidade</th>';
  echo '<th>Observação</th>';
  echo '<th>Solicitante</th>';
  echo '<th>Coletadora</th>';
  echo '<th>Data Coleta</th>';
  echo '<th>Hora Coleta</th>';
  echo '<th>Protocolo</th>';
  echo '</tr></thead>';
  echo '<tbody>';

  $stmt = $dbh->query('SELECT *, date_format(data_chamada, "%d%/%m%/%Y") as data_chamada, date_format(data_coleta, "%d%/%m%/%Y") as data_coleta FROM coleta_hc_2017 ORDER BY id DESC LIMIT 100');
  while($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
  echo '<tr>';
  echo '<td>' . $row['data_chamada'] . '</td>';
  echo '<td>' . $row['hora_chamada'] . '</td>';
  echo '<td>' . $row['unidade'] . '</td>';
  echo '<td>' . $row['observacao'] . '</td>';
  echo '<td>' . $row['solicitante'] . '</td>';
  echo '<td id="coletadora">' . $row['coletadora'] . '</td>';
  echo '<td id="data_coleta1">' . $row['data_coleta'] . '</td>';
  echo '<td id="hora_coleta">' . $row['hora_coleta'] . '</td>';
  echo '<td id="protocolo">' . $row['id'] . '</td>';
  echo '</tr>';
  }
  echo '</tbody></table>';
?>

还有一个插件可以让用户编辑这个表，问题是我无法处理用户插入的数据，我正在尝试使用 Ajax 来做到这一点，这是我的代码：

var table = $('#tableteste').DataTable();

function  myCallbackFunction(updatedCell, updatedRow, oldValue) {
    $.ajax({
        url: "include/edita.php",
        type: "POST",
        data:,
        success: function(data){
    alert(data);                                 
         }
     });
   }

但是正如你所看到的，我不知道如何设置“数据”字段，尝试了很多不同的东西但都没有奏效，你们能帮我解决这个问题吗？

Answer 1

你可以实现这个功能。

function tableToArray(table){
    var result = [];
    for(var y=0;y<table.rows.length;y++){
       for(var x=0;x<table.rows[y].cells.length;x++){
          result.push(table.rows[y].cells[x].innerHTML); // PUSH VALUE INTO ARRAY
       }
    }
    return result;
}

然后可以使用 AJAX 将这个数组传递给 PHP。

编辑 1

由于您不知道如何实现，我将再添加一个示例。

var table = document.getElementById(tableteste);

function tableToArray(table){
    var result = [];
    for(var y=0;y<table.rows.length;y++){
       for(var x=0;x<table.rows[y].cells.length;x++){
          result.push(table.rows[y].cells[x].innerHTML); // PUSH VALUE INTO ARRAY
       }
    }
    return result;
}

function  myCallbackFunction(updatedCell, updatedRow, oldValue) {
    $.ajax({
        url: "include/edita.php",
        type: "POST",
        data: tableToArray(table),
        success: function(data){
    alert(data);                                 
         }
     });
}

编辑 2

是的，正如 OP 刚刚指出的那样，您需要有两个不同的变量，一个仅用于函数 (tableToArray)，另一个用于插件。我只是没有指出它，因为我认为它很明显。

编辑 3

只是解决新问题。

在回调中，需要编辑POST方法。

function  myCallbackFunction(updatedCell, updatedRow, oldValue) {
    $.ajax({
        url: "include/edita.php",
        type: "POST",
        data: {
              table_data: tableToArray(table)
              },
        success: function(data){
    alert(data);                                 
         }
     });
}

我只想指出，您可能需要将名称 table_data 交换为您使用 $_POST[] 获取的名称。