Question

我在页面中动态加载表格。其中每一行都可以在Bootstrap模式中编辑，并且可以使用多个选中的复选框通过ajax删除每一行。在第一次加载页面时，Bootstrap模式中的提交按钮用于编辑目的正常工作。一旦页面中的表在删除后通过ajax加载，bootstrap模式中的提交按钮就不会响应任何内容。关闭按钮将关闭模态。

This is the Bootstrap modal

如果文本框保留为空，则甚至不会对其进行验证。这是我项目中非常重要的一步。请帮我解决这个问题。提前谢谢。

$(document).ready(function() {
    $('.callDelete').click(function() {
        var data = {'ids[]': []};
        $(":checked").each(function() {
            data['ids[]'].push($(this).val());
        });
        var len = data['ids[]'].length;
        if (len === 0)
        {
            $('#myModalDeleteFail').modal('show') // this modal shows an alert message in pop
            setTimeout(function() {
                $('#myModalDeleteFail').modal('hide');
            }, 2500);
        }
        else
        {
            $.ajax({
                url: "deleteAjax.php",
                type: "post",
                data: data,
                success: function(data) {

                    $('.acceptAjaxData').html(data);
                    alert("Deleted Successfully");
                }
            });
        }

    });
 });

我在上面添加了jquery代码，用于使用ajax删除多行，并从ajax页面本身添加我在当前页面中新加载的所有行。一旦所有记录都通过Ajax加载，弹出窗口中的“提交”按钮就不会被点击。请帮我解决这个问题。提前谢谢。

Answer 1

当你的表列表从ajax重新加载时，问题似乎与删除，保存（提交按钮）等上的事件处理程序丢失有关。

因为，您已经注册了如下所示的事件处理程序：

$('.callDelete').click(

重新加载列表中的事件确实会被保留。

尝试为所有处理程序注册以下活动：

$('.elementClass').on('click', function() { // code
});

并不喜欢：

$('.elementClass').click(function() { // code 
});

Answer 2

试试这个

$(function() {
    $('body').on('click', '.callDelete', function() {
        var data = {'ids[]': []};
        $(":checked").each(function() {
            data['ids[]'].push($(this).val());
        });
        var len = data['ids[]'].length;
        if (len === 0)
        {
            $('#myModalDeleteFail').modal('show') // this modal shows an alert message in pop
            setTimeout(function() {
                $('#myModalDeleteFail').modal('hide');
            }, 2500);
        }
        else
        {
            $.ajax({
                url: "deleteAjax.php",
                type: "post",
                data: data,
                success: function(data) {

                    $('.acceptAjaxData').html(data);
                    alert("Deleted Successfully");
                }
            });
        }

    });
 });

Bootstrap模式中的Sumit Button没有被点击

2 个答案: