jQuery的.将选择器以动态形式应用于每个字段 [英] jQuery. Apply selector to every field in a dynamic form

问题描述

我有一个使用此jQuery插件动态构建的表单

I have a form which is built dynamically using this jQuery plugin

http://code.google.com/p/jquery-dynamic-form/

当我复制 div 时， div 中的所有字段都被复制，并且-as plugin docs state- brackets 字段名称

When I duplicate a div, all the fields in the div are duplicated, and -as plugin docs state- brackets are added to the field name

我也使用jQueryUI.我使用datePicker插件

I use also jQueryUI. I use the datePicker plugin

$("#myDynDateField").datepicker();

当此datePicker字段只有1个实例时，它可以正常工作.当我复制整个div时，datePicker字段也被复制，并且错误开始

It works fine when there's only 1 instance of this datePicker field. When I duplicate the whole div, the datePicker field is also duplicated, and errors begin

inst is undefined
uncaught exception: Missing instance data for this datepicker  

1)我如何使用也覆盖所有重复字段的jQuery选择器?
2)如何确保每个重复的datePicker字段都有其正确的实例，等等?

1) How can I use a jQuery selector that covers all the duplicated fields also?
2) How can I make sure that every duplicated datePicker field will have its right instance, etc.?

非常感谢

推荐答案

我不确定您是否正在使用$.clone()来复制"您的元素，但是如果是这样，问题可能出在传递true标志.例如$('div#id').clone(true).这将克隆元素以及与其关联的事件(及其子元素).但是，在jquery ui元素上使用此元素可能会破坏一些事情，因此最好在复制元素后重新定义其ui信息.

I'm not sure if you are using $.clone() to 'duplicate' your elements, but if you are, the issue might stem from passing in the true flag. e.g. $('div#id').clone(true) . This clones the element as well as the events attached to it (and it's children). However using this on jquery ui elements can ruin a few things, so it's better to redefine an element's ui info after its duplication.

机会是可以的，尽管您没有用这种粒度来控制它.或多或少，您会遇到问题，因为jqueryui不知道这些重复的表单字段.我建议删除datepicker字段的重复"版本，并用新的datepicker字段替换.

Chances are, though that you are not controlling it with that granularity. More or less, you are running into problems because jqueryui isn't aware of these duplicated form fields. I would suggest removing the 'duped' version of the datepicker field and replacing it with a fresh datepicker field.

类似这样的东西:

// code to duplicate form
// ...
// Now replace the element with one just like it but without any events
$('#newDupedForm')
    .find('.datefield')
    .replaceWith(
        $(this).clone(false).datepicker(options)
    );

那应该摆脱其他元素到旧jquery ui datepicker的任何链接，并实例化一个新元素，但是，如果我缺少某些内容，则可以始终从头开始创建input元素并执行replaceWith这样.

That should get rid of any links to the old jquery ui datepicker from the other element and instantiate a new one, however if there's something I'm missing, you could always create the input element from scratch and do the replaceWith with that.

这篇关于jQuery的.将选择器以动态形式应用于每个字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！