Question

当用户点击链接打开表单时（我正在使用带有表单init的bootstrap Modal），在提交时创建新记录并将其添加到页面上（全部使用jquery和ajax）。

如果用户点击新添加的项目，将打开相同的表单，ajax将获取数据并预先填充表单。但这次jquery还将使用Delete按钮创建一个新表单。

但是当我点击“删除”按钮时，表单将生成一个完整的（非ajax）请求，并且项目将被删除。

不确定为什么创建操作preventDefault工作（停止表单以发出完整的POST请求），但是当我单击“删除”按钮/表单时，它会发出完整请求。

两个事件处理程序都在同一个匿名函数中。下面是处理提交事件的jQuery / javascript：

     // save form
form.on('submit',function(e){
    e.preventDefault();
    $.when(submitAjaxRequest(this)).then(function(data, textStatus, jqXHR){
        if(update){
            $this.replaceWith(data)
        }else{
            addInput($this,data);
        }
        modal.modal('hide');
    });
});

// delete form
$('.panel-heading').on('submit','form #deleteForm',function(event){
    event.preventDefault();
    $.when(submitAjaxRequest(this)).then(function(data, textStatus, jqXHR){
        $this.remove();
        modal.modal('hide');
    });
});

Answer 1

我无法看到你的HTML，但如果你的删除表单不在创建表单中，我认为选择器是错误的，所以事件永远不会被触发，我想你的删除按钮是type="submit"，所以你得到html提交。你必须删除空间......

$('.panel-heading').on('submit','form#deleteForm',function(event) {
....

我希望它有所帮助

preventDefault适用于一个表单，但不适用于同一模式中的另一个表单

1 个答案: