选择 Kendo UI ListView 项目

3
使用Kendo ListView,当我的页面重新加载时,如果已经进行了选择,我需要让我的代码自动选择先前选择的ListView项。我可以通过迭代数据源集合来获取Kendo DataItem,但是当我执行listView.select(item)时,UI不会显示任何选定内容。
以下是我的列表视图:
$("#listview").kendoListView({
        dataSource: coverages,
        template: kendo.template($("#listTemplate").html()),
        selectable: true,
        change: function() {
            var index = this.select().index();
            dataItem = this.dataSource.view()[index];

            if (selectedCoverageCode == null) {
                selectedCoverageCode = dataItem;
            }

            onCodeChanged(categoryId, planId, dataItem);
        }
    });

以下是我设置之前选定项的代码:

   function setSelectedCoverageCode(code) {
    var listView = $("#listview").data("kendoListView");
    var dataSource = listView.dataSource.view();
    if (listView) {
        $.each(dataSource, function(index, item) {
            if (item.Code === code) {
                listView.select(item);
                selectedCoverageCode = item;
            }
        });
    }
}

我认为我需要DOM对象而不是数据源DataItem。上述的setSelectedCoverageCode函数会触发Change事件,但实际元素在DOM中并未被选中。

我该如何做才能在重新加载时将项目显示为已选择?有什么建议吗?

谢谢

1个回答

8

您可以通过查找其UID来获取数据项的DOM元素。

var item = // the item out of the DataSource that you want to select
var listView = $("#listview").data("kendoListView");

listView.select(listView.element.find('[data-uid="' + item.uid + '"]'));

我传递的代码是DataItem的值。如何仅通过该值从数据源获取整个DataItem? - Encryption
你可以通过循环数据项并查找它来实现。使用 dataSource.view() 从数据源中获取项目数组。 - CodingWithSpike
完美。运行良好。我在这个问题上一直想不出来,谢谢你。 - Encryption
是的,如果文档明确说明只能将DOM元素作为参数传递(截至撰写本文时,尚未如此),那就太好了 - http://docs.telerik.com/kendo-ui/api/javascript/ui/listview#methods-select 当前的情况似乎迫使我编写相当糟糕的代码,而我已经拥有所需的数据对象。 - PandaWood

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接