jQuery多个表单提交

问题描述：

我在页面上有4个表单。我知道表单不能嵌套。jQuery多个表单提交

<form id="form1"></form>

<form id="form2"></form>

<form id="form3"></form>

<form id="form4"></form>

的顺序呈现。

表单1和表单4发布到同一个php页面进行处理。表单1有1个输入字段表单4有多个字段，复选框和选择。

表单1或表单4发送两种表单的组合字段的最佳方法是什么？

我试过jQuery，对文本输入和复选框非常适用，但不能让它与Select一起工作。尝试结合表单1和表单4并使用css重新定位表单1，但无法获得正确的布局。

有没有更简单的做到这一点？

答

这是不可能的。您可以使用serialize()或serializeArray()方法用于获取形式的数据，并将它们发布到使用Ajax服务器：

编码一组表单元素作为提交字符串。

$('#send').click(function() { 
    var firstFormData = $('form:eq(0)').serializeArray(); 
    var fourthFormData = $('form:eq(3)').serializeArray(); 
    $.ajax({ 
     url : '...', 
     type : 'post', 
     data : firstFormData.concat(fourthFormData) 
    }).done(function() { 
     // ... 
    }); 
});

你打败了我。我的upvote先生。 – Ruel 2012-07-07 08:03:59

@undefined ++ 1 bazinga！ – 2012-07-07 08:08:08

@undefined谢谢，其实.serialize是我尝试的第一件事。似乎没有捕获复选框数组。然后我试着：$（'＃form4：input'）。not（'：submit'）。clone（）。hide（）。appendTo（'＃form1'）;这对所有输入都很好，但不是

答

好了，我不能让.serialize（）与form4例如复选框阵列工作

<input type="checkbox" id="model[]">

我想抓检查值，但不能让他们与其他输入一起连载：

var vals = [] 
    $('input:checkbox[name="model[]"]').each(function() { 
     if (this.checked) { 
      vals.push(this.value); 
     } 
    });

等我回去，做简单的事情：

删除Form1中，移动文本输入和提交按钮在<div id="searchbox" style="position:abosulte;top:-100px;left:0px;">My original form1</div>里面form4。

将一个占位符<div id="placeholder" style="position:relative;"></div>放在form1和form1以前的位置之上。

上面放置一个javascript：

$(document).ready(function(){ 
    $("#searchbox") 
    .appendTo("#placeholder"); 
});

移动文本输入和提交按钮来定位他们的绝对和相对的占位符格。

这样我将它们减少到1个表单（这是它的意图），不依赖于JavaScript来操纵任何数据，并且不需要我在两个表单上进行串联序列化。

jQuery多个表单提交

相关推荐