使用jquery或ajax同时保存两个表单？

Question

我打算保存2个表单，但第一个表单是我获取第二个表单的外键。

这是我尝试使用Javascript保存此内容：

$("#btnSave").click(function (e) {
        e.preventDefault();
        $('#workForm').submit();
        $('#contForm').submit();
    });

但它在控件中的联系表单提交时出错，因为在保存作为其外键的联系表单时，工作表的ID仍然为空

如何使用Jquery和Javascript以及Ajax处理它？<​​/ p>

我也尝试过这种方法：

$("#btnSave").click(function (e) {
        e.preventDefault();


        if (Id != 0) {
            $('#workForm').submit();
            $('#contForm').submit();
        } else {
           $('#workForm').submit(); }
    });

但它只出现在Else，因为ID为空

我希望有人可以帮助我

工作人员地址是WorkForm工人联系人是ContForm

我想在填充所有文本框时保存它们

Answer 1

您需要使用.ajax发布两个表单。从两个表单序列化数据，然后发布到您的服务器脚本。

$("#btnSave").click(function (e) {
  e.preventDefault();
  //Serialize the form data
  var formOne$ = $('#workForm').serialize();
  var formTwo$ = $('#contForm').serialize();

  $.ajax( { url : "YOURURL", type: 'post', data : { formOne : formOne$ , formTwo : formTwo$ }, 
    success : function( responseText ){
        //Forms were submitted
    },
    error : function( e ){
        alert( ' Error : ' + e.statusText );
    }
  });

});

Answer 2

你必须使用ajax，因为

$('#contForm').submit();

将永远不会运行，因为第一次调用将卸载页面：

 $('#workForm').submit();

Answer 3

您可以使用ajaxSubmit()提交第一个表单，并在成功时提交第二个表单。

$("#btnSave").click(function() {
    $('#workForm').ajaxSubmit({
        forceSync: true,
        error: function(errorDetails) {
            //Error Handling
        },
        success: function(successData) {
            $('#contForm').submit();
        }
    });
});