php - 使用 ajax 和 php 从动态创建的表单中删除记录

Question

我想删除动态创建的记录，但是代码不起作用..请看一下

脚本.js

$(function() {

            $('#studentRecord').on('click', 'button.delete', function() {

            var $tr = $(this).closest('tr');

            var $id = parseInt( $(this).attr('id').split('-')[1] );


            if ( confirm("Are you sure you want to delete this record") ) {

                $.ajax({
                    url: '/ab_batch/practice/db/action.php',
                    type: 'POST',
                    data: {
                        action: 'ajaxDelRecord',
                        id: JSON.stringify(id)
                    },

                    success: function() {},


                    error: function() {}

                });

            }


        });


    });

Action .php

$action = ( isset($_REQUEST['action']) && !empty($_REQUEST['action']) ) ? $_REQUEST['action'] : null;
switch ($action) {
case 'ajaxDelRecord':

        if ( isset($_POST['id']) ) {
            $id = json_decode($_POST['id']);
        }

        $id = json_decode($_POST['id']);
        print ( $student->delRecord($id) ) ? 'true' : 'false' ;

        break;

}

还有一个文件db.php，里面包含了删除、添加、更新的所有API

Answer 1

JSON.stringify(id) 应该是 JSON.stringify($id) 因为你声明你的 id 为 $id ，你真的不需要: JSON.stringify 因为你只是向服务器发送一个整数。

要删除刚刚从数据库中删除的行，您只需将 javascript 代码替换为以下代码:

$(function() {

            $('#studentRecord').on('click', 'button.delete', function() {

            var $tr = $(this).closest('tr');

            var $id = parseInt( $(this).attr('id').split('-')[1] );


            if ( confirm("Are you sure you want to delete this record") ) {

                $.ajax({
                    url: '/ab_batch/practice/db/action.php',
                    type: 'POST',
                    data: {
                        action: 'ajaxDelRecord',
                        id: JSON.stringify($id)
                    },

                    success: function() {},

                      $tr.remove(); // removing the current deleted record from html.
                    error: function() {}

                });

            }


        });


    });

我确实在成功回调中添加了 $tr.remove();，因为您已经声明了已删除记录的父元素，所以您只需要使用:$tr .remove(); 删除 tr.