Question

我试图从表单外的链接（而不是提交按钮）触发表单的提交。

以下是表单的基础知识：

<form action="/Hospice/TabPatientTrackingPost" id="formTabPatientTrackingPost" method="post">

    [a big form with lots of inputs]

    <div class="pull-right">
        <button type="submit" class="btn btn-brand" id="btnSave" name="btnSave">Save</button>
        <button type="reset" class="btn btn-brand" id="btnCancel">Cancel</button>
    </div>
</form>

链接如下所示：

<a href="/Hospice/TabLiving/1" onclick="triggerSave();">Living</a></li>

JS功能：

 function triggerSave() {
    alert("triggerSave test alert");
    $("#formTabPatientTrackingPost").submit(); 
}

但是，代码$("#formTabPatientTrackingPost").submit();并未导致表单发布提交。

alert("triggerSave test alert");正在解雇，但表单未提交。

如果我只点击“保存”按钮，它就可以正常工作。

任何想法我做错了什么？

Answer 1

根据您发布的内容，这对我来说很好。

http://jsfiddle.net/jFYN2/

triggerSave();

我会检查以确保你包含正确版本的jQuery。

同时验证[没有大量输入的大表单]

中是否存在任何语法问题

Answer 2

试试这个：http://jsfiddle.net/8rLGN/2/

$('a').click(function(e) {
    e.preventDefault();
    alert("triggerSave test alert");
    $("#btnSave").trigger('click'); 
});

Answer 3

在从onclick属性调用函数时，您需要确保您的函数全局可用，请尝试：

triggerSave = function() {
    alert("triggerSave test alert");
    $("#formTabPatientTrackingPost").submit();
}

DEMO

Answer 4

当我更多地研究这个问题时，我意识到问题只发生在Chrome中。一切都在Firefox和IE中工作（是的，谁会猜到）。

然后，这导致我发表这篇文章：JQuery submit not working in Chrome

所以，我的最终解决方案是使用AJAX POST来实现这个目的：

    triggerSave = function () {
    $.ajax({
        url: '/Hospice/TabPatientTrackingPost',
        type: 'POST',
        dataType: 'json',
        data: $('form#formTabPatientTrackingPost').serialize(),
        success: function (data) {
            console.log("success");
        }
    });
}

感谢所有帮助过的人！ +1代表所有有用的答案。

jQuery submit（）没有触发

4 个答案: