克隆包含剑道输入的div [英] Cloning div containing kendo inputs

问题描述

我有一个应用程序允许用户动态创建包含kendo输入的div。要做到这一点，我有一个包含多个剑道输入的div，我使用它作为一种模板。当用户决定添加一个节到页面中时，我使用jquery.clone（）克隆我的div。在用户界面中一切看起来都很好，但由于kendo输入只能在HTML中初始化一次，然后被复制，所以输入不会被重建，因此初始ID不是唯一的，输入也不起作用。

我试图通过编程来解决这个问题：

  var $ kendoInputs = $$（。draggableContainer .K输入）; 
 for（var j = 0; j <$ kendoInputs.length; j ++）{
 if（$（$ kendoInputs [j]）。attr（id））{
 var newid =newid+ j; 
 $（$ kendoInputs [j]）。attr（id，newid）.attr（name，newid）; 
 
 
 
 
 
 
 $ b 
但是由于输入已经被初始化，在这一点上IDS是无用的。有没有办法改变一个剑道输入的ID，然后重新编译它？
 
 
 
对不起，有很多文本，并且提前致谢 
 
解决方案
这几乎就是 ： http://dojo.telerik.com/@Stephen/EWEna  
 
 
 
尝试克隆kendo元素的基本输入（与一个新的id）而不是所有kendo增加的元素。 
然后获取原始小部件的类型和选项，并将原始类型的新元素初始化为原始选项。
  var originalElement = $（＃+ originalID）; 
 var originalWidgetType =kendo+ kendo.widgetInstance（originalElement）.options.name; 
 var originalWidget = originalElement.data（originalWidgetType）; 
 
元素[originalWidgetType]（originalWidget.options）; 
  
我的dojo示例接近...但由于某种原因，克隆的DatePickers太宽了......我还没有测试过所有可能的元素，但我认为它可以作为开始。
 
 
 
 编辑 
 
 
 
我发现这种使用Kendo MVVM的技术，看起来会更好： http ：//jsfiddle.net/krustev/U6nSv/  
 
 
 
这不是我的解决方案（不知道如何评分）。 
 
 
 
这是我最初使用该技术更新的示例： http://dojo.telerik.com/@Stephen/aquRE  
 
I have an application which allows users to dynamically create divs containing kendo inputs. To do so I have a div which contains multiple kendo inputs which I use as a sort of template. When the user decides to add a section to the page, i clone my div using jquery.clone(). Everything looks fine in the UI, but since the kendo inputs only get initialized one time in HTML and are then copied, the inputs are not rebuilt therefore the initial ID is not unique and the inputs are not functional.

I tried to fix this programmatically by doing
var $kendoInputs = $$(".draggableContainer .k-input");
for (var j = 0; j < $kendoInputs.length; j++) {
    if ($($kendoInputs[j]).attr("id")) {
        var newid = "newid" + j;
        $($kendoInputs[j]).attr("id", newid).attr("name", newid);
    }
}
but since the inputs have already been initialized, changing the ids at this point is useless. Is there any way to change the ID of a kendo input and then rebuild it?

Sorry for the long block of text and thanks in advance
解决方案
This is almost there: http://dojo.telerik.com/@Stephen/EWEna

Try cloning just the base inputs of the kendo elements(with a new id) instead of the all the elements that kendo adds.
Then get the type and options of the original widget and initialize the new element as the original type with the original options.
var originalElement = $("#" + originalID);
var originalWidgetType = "kendo" + kendo.widgetInstance(originalElement).options.name;
var originalWidget = originalElement.data(originalWidgetType);

element[originalWidgetType](originalWidget.options);
My dojo example is close...but for some reason the cloned DatePickers are too wide...and I haven't tested with all the possible elements but I think it could be used as a start.

EDIT

I found this technique using Kendo MVVM that seems like it would be better: http://jsfiddle.net/krustev/U6nSv/

This is not my solution(not sure how to credit).

Here is my original example updated to use that technique: http://dojo.telerik.com/@Stephen/aquRE

                        
这篇关于克隆包含剑道输入的div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！