如何使用Kendo UI动态插入元素

Question

我正在尝试使用移动kendo UI创建动态列表视图。我知道，当我将内容附加到DOM时，我必须初始化元素，如果要使用jQuery，我会做

之类的事情

$('#list').append(newElementStr);
$('#list').trigger('create');

这是我在这里想做的示例：http：//jsfiddle.net/ab3yu/

您可以看到动态插入的元素看起来与其他列表项目不同，我该如何初始化？

谢谢。

Answer 1

您始终可以在列表的数据源上添加数据。这是我将所有项目从一个列表转移到另一个列表的方式

function moveAllLeft() {
    var listView2 = $("#listView2").data("kendoListView");
    listView2.element.children().each(function() {
        listView2.remove($(this));
        var that = $(this);
        dataSource.add({
            ProductName : that[0].innerText
        });
    });
}
function moveAllRight() {
    var listView = $("#listView").data("kendoListView");
    listView.element.children().each(function() {
        listView.remove($(this));
        var that = $(this);
        dataSource2.add({
            ProductName : that[0].innerText
        });
    });
}

dataSource是第一个列表的数据源，而DataSource2第二列表的数据源。

Answer 2

班级缺少http://jsfiddle.net/ab3yu/2/

$('#list').append('<li><a href="#" class="km-listview-link" data-role="listview-link">' + 'Dynamic Item' + '</a></li>');
$('#list').append('<li><a href="#">' + 'Dynamic Item' + '</a></li>');​

有关将项目添加到ListView

的演示

在如何使用Kendo-UI-Web的ListTview上，链接到将Twitter数据加载到Web listview中。由于移动ListView还拥有一个数据源属性，因此可以在移动列表视图上使用