通过jQuery在另一个表单提交事件中提交表单

Question

我在一页上有两个表单。当我单击父表单的submit按钮时，会调用父表单提交事件，在这里我编写了在submit方法的帮助下提交第二个表单的逻辑(参见下面的代码)。问题是，当第二个表单提交方法被调用时，它会在提交父表单之前自动重新加载页面。

<script type="text/javascript">
$(document).ready(function () {
    $("#aspnetForm").submit(function(event) {               
        debugger;
        var marketoForm = MktoForms2.allForms()[0];
        console.log(marketoForm);
        marketoForm.addHiddenFields({
        //These are the values which will be submitted to Marketo
        "Email": $('#MainContentPlaceHolder_C003_ctl00_ctl00_C006_ctl00_ctl00_textBox_write').val(),
        "FirstName": $('#MainContentPlaceHolder_C003_ctl00_ctl00_C001_ctl00_ctl00_textBox_write').val(),
        "LastName": $('#MainContentPlaceHolder_C003_ctl00_ctl00_C005_ctl00_ctl00_textBox_write').val(),
        "Phone": $('#MainContentPlaceHolder_C003_ctl00_ctl00_C012_ctl00_ctl00_textBox_write').val(),
        "MarketoSocialGender": $('#MainContentPlaceHolder_C003_ctl00_ctl00_ctl06_C051_ctl00_ctl00_dropDown').val()
        });             
        marketoForm.submit();
        return false;
    });
});
</script>

Html如下所示-

<form method="post" action="./physical-therapy-test-by-rahul" id="aspnetForm">
    <form id="mktoForm_15528"></form>
</form>

有没有人能帮我解释一下为什么我的页面会重新加载？如何在提交第一个表单时同时提交两个表单？

Answer 1

你不能像那样嵌套多个表单。当提交marketo表单时，它将发送内部表单，并将发送回服务器，除非您正在捕获表单提交。但是，您添加到内部表单的任何内容都可以通过外部表单获得。如果marketoForm.addHiddenFields()方法添加了附加的输入字段，那么这些字段也可以在asp.net表单中使用，这意味着内部表单可能只是一个向其中添加内容的DIV.

由于字段是动态添加的，因此需要通过服务器上的Request.Form("Email")获取值。

ASP.NET web窗体有一些ASP.NET MVC消除的限制；我不知道这是不是另一种可能性。或者，如果您可以通过AJAX提交内部表单，然后触发到外部表单的post，则可以将内部表单作为另一种选择(加上内部表单不需要是<FORM>标记，而是在$.ajax调用中序列化的div )，但我不知道在什么情况下才能知道它是否有效。