使用ajax jquery编辑和更新数据

时间:2018-01-20 06:07:53

标签: javascript php jquery ajax mysqli

请帮帮我。我的代码有什么问题。我想使用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);
    });

2 个答案:

答案 0 :(得分:0)

这是另一种方法。

type

上述代码删除了每个<?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 } ?> 中的所有$item['id']。它还为td id edit button添加了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; ?>"。 这应该工作。如果这是解决方案,请不要忘记将接受设置为正确答案。谢谢。

答案 1 :(得分:0)

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

Console.log(field_name+edit_id);

按照日志记录。我认为“id”的请求不是复数(数组)。

url : "modules/favorites/edit.php"

确保文件路径正确。