经过几次选择后，Kendo multiselect启用摘要标记模式

Question

我使用此模板在摘要标记模式下设置了剑道多重选择：

# if (dataItems.length < 4) { # 
    # for (var idx = 0; idx < values.length; idx++) {#
        #:dataItems[idx].Name# 
        # if (idx < values.length - 1) {#</li><li class="k-button" unselectable="on">  # } #
    #}#
# } else {#
    #:values.length# item(s) selected 
# } #

这可行，但是很老套。它的作用是显示前几个条目，如果选择四个或更多，则将它们分组。此控件的kendo ui版本具有一个属性，该属性允许我在此处自动执行操作。[kendoMultiSelectSummaryTag]="3"但是，除非我找错地方，否则该属性似乎不可用。有人可以告诉我如何使用它吗？我想使用默认功能，因为它允许从选择显示中删除。

Answer 1

据我所知，您没有可以设置的简单属性来帮您实现。幸运的是，该解决方案并不是很棘手。想法是将默认的tagMode设置为'multiple'（默认情况下是它），然后创建一个事件处理程序，当项目数超过阈值时，该事件处理程序会将tagMode更改为'single'。

您的多选定义将需要将事件处理程序附加到change事件：

@(Html.Kendo().MultiSelect()
  .Name("multiSelect")
  // other properties as needed of course
  .Events(events => events
    .Change("tagModeSet")
  )
)

然后，JavaScript事件处理程序将如下所示：

function multiTest() {
  // Get the currently selected values and tagMode
  var selectedValues = this.value();
  var currentTagMode = this.options.tagMode;
  var newTagMode = currentTagMode;

  // Test to see if you have crossed the threshold
  if (selectedValues.length <= 3) {
    newTagMode = "multiple";
  } else {
    newTagMode = "single"
  }

  // Update the tagMode if needed
  if (newTagMode != currentTagMode) {
    this.value([])
    this.setOptions({
      tagMode: newTagMode
    });
    this.value(selectedValues);
  }
}

请注意，当您更新tagMode时，首先要清除项目，然后调整模式，然后重新选择项目。希望有帮助。

Reference