Question

我的表格中有一个“细节”部分，如果有的话。请看一下：

[已删除网址] 点击添加项目，

然后你会看到你可以输入前5个字段并点击更新。这些将按预期保存。

尝试将一些数据添加到“vintages”部分（填写所有字段），然后单击“保存并添加”。这将保存您的编辑并添加新记录以进行编辑。这是iframed in。

现在。我的问题是，如果我填写前5个字段，然后输入复古信息，但不要点击“保存并添加”，只需点击“更新”，它就不会提交iframe和数据包含在内的将丢失。

关于我如何做出这种改变的任何建议也提交内部表格。我已经尝试过了：

<script>
$(function(){
   $('#item_edit').submit(function(){
       alert('try');
 $('iframe').first().contents().find('.form').submit();
   });
});
</script>

事实上，这是目前的形式，它不起作用。它会运行，但它不想提交。此外，如果我手动运行$('iframe').first().contents().find('.form').submit();，它将提交并保存详细/复古表单的内容。所以我认为父表单在子表单有机会之前提交。

关于如何避免这种情况的任何想法？

杰森

Answer 1

您关联的页面已消失，因此我无法查看您的完整示例。但是这里有一些想法要考虑......

当我这样做时，我通常会避免在iframe中构建子表单。相反，我将所有字段都放在一个表单中。如有必要，动态添加新字段，所有字段都以相同的形式添加。

如果需要，您可以提交整个表格 - 该部分变得简单。

如果您只需要提交表单的一部分，则可以在提交时“挑选”您想要的字段。

要做这种“樱桃挑选”提交，只需创建一个带有表单的新隐藏iframe;然后使用[jQuery的.clone()函数]复制您关心的字段，并将副本填充到新的隐藏表单中;最后，只需提交您的隐藏表格。

here's a quick example从我的一些旧代码拼凑而成。

另一种方法

也许你可以将我的方法的一个方面与你今天的代码结合起来......你已经在他们自己的iframe中得到了你的子表单 - 而且一切正常。问题是您需要将子表单数据与主表单数据一起发送。

所以你可以像我上面所描述的那样使用clone() - 但方向相反。单击更新按钮时，只需clone() iframe中的所有内容，并将其转储到主窗体内隐藏的div中。然后继续让表单提交，用它来所有数据。只需确保两个表单中的元素名称是唯一的（因为所有内容最终都会以相同的形式结束）。

也许是这样的：

$(function(){
   $('#item_edit').submit(function(){
       alert('try');
       var frmContents = $('iframe').first().contents().find('form > *').clone(true);
       var el = $('<div></div>');
       el.append( frmContents );
       el.css('display','none');
       $('#item_edit').append( el );
   });
});

当我在父母提交表格时如何提交iframed表格（使用jquery）

1 个答案: