重复的jquery ui问题 [英] Duplicate jquery ui problem

问题描述

我正在开发Django项目。但是我的问题在于JQuery。
我使用 jquery.formset.js 添加JQuery插件在inline_formsets，formset_factories中动态形成。这样做很不错。它将第一行元素与其他装饰标签（如div，span，img ..）重复，并将新行添加到表的底部。所以重复的行可以像起源一样出现。

我也使用 jquery ui（datepicker，autocomplete..etc）在我的表单。

由于插件尝试不留下任何界面部分，所以复制复制所有内容，甚至是附加的html，由datepickers和autocompletes。当克隆第一行时，所有内容都被克隆，甚至克隆了事件。所以当我点击新出现的datepicker输入日历事件在第一行的元素上工作。

我正在尝试找到决定。以下是我目前为止的一切。

1. 将jquery ui（datepicker和autocomplete）声明为 / STRONG>？例如$ /
   
   $ p $（。dates）。live（'...'，function（）{$（this）.datepicker（）;}）

   
   
   

   但我不知道应该处理哪个事件。我想这是不可能处理新的创建或附加的元素。




2. 将脚本放在行内？元素之后

   
   
   
   
   
   
   $（＃id_birthday_1）datepicker（）;
   
   
   

   似乎最好的想法，但重复已经复制了额外的元素/ htmls。所以它会重新渲染元素。




3. 我应该编辑js插件吗？像绑定所有的jquery ui的事件的声明，除了渲染和追加和造型。这将是一个巨大的混乱。我不想像这样搞砸..每次如果我需要添加一个新的ui，我应该不断地编辑这个js

每个想法都不胜感激：）

解决方案

当添加新表单时，formset插件可以调用函数，您可以初始化新添加的字段。该函数应该采用单个参数， row ;它将被传递一个jQuery对象，包装刚添加的表单。

  $（'＃myFormset1Table tbody tr'）。 formset（{
 added：function（row）{
 row.find（。date）。datepicker（）; 
} 
}）; 
  

I'm working on a Django project. But my problem is on JQuery. I used jquery.formset.js JQuery plugin to add form dynamically in inline_formsets, formset_factories. And this works pretty nice. It duplicates the first row elements with its other decoration tags (like div, span, img..) and adds the new row in the bottom of the table. So the duplicated row can be appeared just like the origin.

I also uses jquery ui (datepicker, autocomplete..etc) in my forms.

The duplication copies everything, even the appended htmls by the datepickers and autocompletes, because the plugin tries not to leave any interface pieces. When it clones the first row, everything is cloned, even the events are cloned. So when i click on the newly appeared datepicker input the calendar event works on the first row's element.

I'm trying to find the decision. Here are what in my mind so far..

1. Declare the jquery ui (datepicker and autocomplete) as live? like

   $(".dates").live('...', function() { $(this).datepicker(); } )

   But I'm not sure which event should be handled for this. I guess it's impossible to handle the new created or appended elements.

2. Putting the script inside the row? right after the element

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

   It seems the best idea, but the duplication has already duplicated the extra elements/htmls. So it will re-render the element.

3. Should I edit the js plugin? like binding all the jquery ui's events' declarations, excepting the renders and appending and styling. That would be a huge mess. I don't want to mess up like this.. And every time if i need to add a new ui, i should edit that js constantly

Every ideas would be appreciated :)

解决方案

The formset plugin can call a function when a new form is added, you could initialize the newly added fields there. The function should take a single argument, row; it will be passed a jQuery object, wrapping the form that was just added.

$('#myFormset1Table tbody tr').formset({
    added: function(row) {
       row.find(".date").datepicker(); 
    }
});

这篇关于重复的jquery ui问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！