2

我正在尝试提交一个表单，其中包含在页面完成加载后由 jQ 添加到 DOM 的动态元素。

当我在表单上运行 serialize() 时，它会抓取硬编码到页面中的所有字段的数据 - 但不是动态字段。

这是一些相同的代码片段..

HTML

<form id="someform" name="someform" method="post" action"">
    <input type="text" name="afield" />
 <ul id="somelist">
 </ul>
 <input type="submit" name="submit" />
</form>

<img id="add" src="add-button.png" />

<div class="new_unit" style="display:none">
 <input type="text" name="somefield" />
</div>

JavaScript 

<script type="text/javascript">
// Adds a new field to the form
$( '#add' ).click( function() {
 $( '#somelist' ).append( '<li>' + $( '.new_unit' ).html() + '</li>' );
});

// Validate before submission
$( '#someform' ).validate({
 .......,
 .....,
 submitHandler: submit_form
});

function submit_form() {
 _data = $( '#someform' ).serialize();
 alert( _data );
}
</script>

点击提交按钮后，静态字段中的数据，字段显示......但jQuery添加的任何一些字段都没有。

我在这里发现了几个类似的问题。我正在遵守建议的解决方案，但没有效果。

我正在使用最新的 jQuery (1.4.1) - 并考虑使用 live() 事件绑定器。我有一种感觉可能有助于解决这个问题，但无法弄清楚如何将它与 validate() 插件结合使用。

有什么建议么 ？

谢谢，m^e

4

1 回答 1

4

问题是您动态添加的字段都命名相同。你要么必须给它们起不同的名字，要么根据你在服务器上使用的东西，你可以给它们一个名字，比如somefield[]聚合它们（PHP，我相信 Python 可以处理这个问题）。

要给它们起一个不同的名称，这样做可能会更容易一些：

<input type="text" id="copy" />

和：

$("#add").click(function() {
  $("#copy").clone().removeAttr("id").attr("name", "field[]")
    .appendTo("#somelist").wrap("<li>")
});
于 2010-01-28T03:29:10.997 回答