Question

我有一个带有模板的kendo ui listview，它根据底层数据有条件地隐藏元素。一个例子如下：

<script type="text/x-kendo-template" id="template">
    <div class="product">
        <img src="../content/web/foods/#= ProductID #.jpg" alt="#: ProductName # image" />
        <h3>#:ProductName#</h3>
        <p>#:kendo.toString(UnitPrice, "c")#</p>
        <div>
          # if (Discontinued) { #
                Discontinued Product
          # } #
        </div>
    </div>
</script>

如果我使用以下代码修改基础dataSource项目以设置Discontinued：

data[index].set('Discontinued', true);

如果索引是当前选定的项目，则该项目将失去焦点并且不再被选中。

请参阅以下道具示例http://dojo.telerik.com/UlOze，从列表中选择一项，然后将其设置为停用。

是否有人为此问题找到了解决方案/解决方法？

感谢。

-------------最终解决方案--------------

继续下面的dimodi的答案后，我拼凑了解决方案..为了实现这一点，dataSource必须具有架构 - ＆gt;模型 - ＆gt; id属性集。

1st捕获当前选定的数据项：

      var selectedItem = $(listElement).find(".k-state-selected");
      var selectedDataItem = list.dataItem(selectedItem);

第二：调用.set后重新找到数据项并设置k状态选择的类。这是必须的，因为列表组件正在重新生成uid。

     if (selectedDataItem) {
        var newSelectedItem = list.dataSource.get(selectedDataItem.ProductID)
        var uid = newSelectedItem.uid;
        jQuery("[data-uid='" + uid + "']").addClass("k-state-selected");
      }

我已经更新了原始的道场来展示这个解决方案，这有助于其他人。

Answer 1

更改数据项时，将重新呈现其对应的ListView项以应用更改。因此，选择会丢失，因为它是纯粹的视觉功能，不会在重新绑定中持久存在。您可以在使用设置（）之前检查项目是否已被选中，然后通过在元素中应用 k-state-selected 类来手动恢复选择。

更改数据时，Kendo ui列表视图失去焦点

1 个答案: