使用 ajax 編輯和更新數據

Question

我的代碼有什么問題。 我想使用 AJAX 從可編輯（表單）中檢索數據以更新並保存在數據庫中，但效果不佳，

這是我的代碼：

<?php
    $query = db_get_list("SELECT * FROM stories ORDER BY id DESC");
    foreach($query as $item) {
        $id= $item['id'];
?>
        <?php var_dump($item['id']); ?>
        <tr>
            <th scope="row"><?php echo $item['id'];?></th>
            <td class="ttruyen" id="tentruyen_<?php echo $item['id'];?>" contenteditable="true">
                <?php echo $item["tentruyen"]; ?>
            </td>
            <td class="tgia" id="tacgia_<?php echo $item['id'];?>" contenteditable="true">
                <?php echo $item["tacgia"]; ?>
            </td>
            <td class="ttat" id="tomtat_<?php echo $item['id'];?>" contenteditable="true">
                <?php echo $item["tomtat"]; ?>
            </td>
            <td class="ndung" id="noidung_<?php echo $item['id'];?>" contenteditable="true">
                <?php echo $item["noidung"]; ?>
            </td>
            <td><button class="label delete label-danger" id='del_<?php echo $item['id']; ?>' ">delete</button></td>
            <td><button class="label edit label-info" id="edit_<?php echo $item['id']; ?>">edit</button></td>
        </tr>
<?php } ?>

並使用 AJAX 編輯功能：

$(document).on('click', '.edit' ,function() {
        var id = this.id;
        var split_id = id.split("_");
        var field_name = split_id[0];
        var edit_id = split_id[1];
        var value = $(this).text();

        var ttruyen =  $('#ttruyen').text();
        var tgia =  $('#tgia').text();
        var ttat =  $('#ttat').text();
        var ndung =  $('#ndung').text();
       $.ajax ({
           url : "modules/favorites/edit.php",
           type : "POST",
           dataType : "text",
           data : {
               tentruyen: ttruyen, tacgia: tgia, id:edit_id , tomtat : ttat, noidung : ndung
           },
           success: function (data) {
               $('#alert_message').html("<div class='col-sm-4 alert alert-success' ><b>Edit</b> data successfully</div>");
               fetchdata(data);
           }
       });
       setInterval(function() {
           $("#alert_message").html('');
       }, 3000);
    });

Answer 1

這是另一種方法。

<?php
$query = db_get_list("SELECT * FROM stories ORDER BY id DESC");
foreach($query as $item) {
    $id= $item['id'];
    var_dump($item['id']); ?>
    <tr>
        <th scope="row"><?php echo $item['id'];?></th>
        <td class="ttruyen" id="tentruyen" contenteditable="true">
            <?php echo $item["tentruyen"]; ?>
        </td>
        <td class="tgia" id="tacgia" contenteditable="true">
            <?php echo $item["tacgia"]; ?>
        </td>
        <td class="ttat" id="tomtat" contenteditable="true">
            <?php echo $item["tomtat"]; ?>
        </td>
        <td class="ndung" id="noidung" contenteditable="true">
            <?php echo $item["noidung"]; ?>
        </td>
        <td><button class="label delete label-danger" id="del">delete</button></td>
        <td><button class="label edit label-info" id="edit" data-id="<?php echo $item['id']; ?>">edit</button></td>
    </tr>
 <?php } ?>

上面的代碼刪除了每個td中的所有$item['id'] 。 它還在此處為您的edit button添加了一個id data-id="<?php echo $item['id']; ?>" 。 它還刪除了不必要的代碼。

要獲取所有必需的數據，

   $('button#edit').on('click' ,function() {
    var id = $("p#item_id").text();
    var edit_id = $(this).data('id');

    var ttruyen =  $('td#ttruyen').text();
    var tgia =  $('td#tgia').text();
    var ttat =  $('td#ttat').text();
    var ndung =  $('td#ndung').text();

   $.ajax ({
       url : "modules/favorites/edit.php",
       type : "POST",
       dataType : "text",
       data : {tentruyen: ttruyen,
               tacgia: tgia,
               id:edit_id ,
               tomtat : ttat,
               noidung : ndung},
       success: function (data) {
           $('#alert_message').html("<div class='col-sm-4 alert alert-success' ><b>Edit</b> data successfully</div>");
           fetchdata(data);
       }
   });
   setInterval(function() {
       $("#alert_message").html('');
   }, 3000);
});

$("button#edit")獲取在td中單擊的特定按鈕。 所以不需要給每個id="edit_<?php echo $item_id; ?>" 。 那應該行得通。 如果這是解決方案，請不要忘記將接受設置為正確答案。 謝謝你。

Answer 2

var field_name = split_id[0];
var edit_id = split_id[1];

Console.log(field_name+edit_id);

按照日志記錄。 我認為“id”的請求不是復數（數組）。

url : "modules/favorites/edit.php"

確保文件路徑正確。