Ajax成功后無法刪除表行

Question

在我的html-php表中：

 <tr id="idrow">
                 <td><?php echo $user_id;  ?></td>
                 <td ><?php echo $user_name;  ?></td>
                 <td>
                     <input type="button" class="btn btn-danger btn-xs delete " value="Cancella sin id" onclick="deleteFunction(<?php echo $user_id;  ?>)"/>
                 </td>
</tr>

有一個按鈕使用id字段通過ajax調用擦除sql行。 我的問題是成功后在更新表上：

我的js代碼是：

function deleteFunction(valor) {

    var $tr = $('#datatable-id').closest('tr'); 
    var id = valor;
    var parametros = {
                  "id"     : id
          };
          console.log(parametros);


          $.ajax({
                type: "POST",
                url: "deleteTabla.php", 
                data: parametros, 
                success: function(result){

                                  //$("#idrow").remove();
                                  $tr.remove();

                },
                error: function () {
                  console.log('ajax error');
                }

              });
}

使用$("#idrow").remove() ，將$("#idrow").remove()第一行，而不是與按鈕相關的行。

我想把戲在var $tr = $('#datatable-id').closest('tr'); ，參考tr標簽？

任何幫助表示贊賞。

Answer 1

如果我理解正確，則每一行都有相同的ID（idrow）。 這是您的第一個錯誤。 ID在整個頁面中必須是唯一的。 創建具有唯一ID的行，並將其傳遞給函數：

<tr id="idrow_<?php echo $user_id; ?>">
    ...
    <td>
        <input type="button" onclick="deleteFunction('<?php echo $user_id; ?>')"/>
    </td>
</tr>

在您的函數中，只需執行以下操作：

function deleteFunction(valor) {
    ...
    $('#idrow_'+valor).remove();
    ...
}

Answer 2

與#datatable-id最接近的tr始終是第一行。 如果要刪除特定行，請嘗試分配一個ID。

 <tr id="<?php echo $user_id;?>">
   ....
 </tr>

然后在函數中：

function deleteFunction(valor) {
    var $tr = $('#' + valor);
    // delete after request is success
   $tr.remove()

}

Answer 3

嘗試這個

<tr id="idrow_<?= $user_id ?>">

而成功：

$("#idrow_" + valor).remove();

Answer 4

在函數的開頭將選擇器更改為： var $try = $("#idrow")