Question

当我在单选标签模式下使用kendoui multiselect并选择maxselection时，如果我点击最大选择，我就不能取消选择项目。有没有解决这个问题？

http://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect

我更新了这个代码段

http://dojo.telerik.com/ovAsA

到这个

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.default.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.dataviz.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.dataviz.default.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.mobile.all.min.css">

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.all.min.js"></script>
</head>
<body>

<select id="multiselect" multiple="multiple">
    <option>Item1</option>
    <option>Item2</option>
    <option>Item3</option>
    <option>Item4</option>
</select>
<script>
$("#multiselect").kendoMultiSelect({
  tagMode: "single",
    maxSelectedItems: 3 //only three or less items could be selected
});
</script>
</body>
</html>

一旦我选择了3个项目，我就无法取消选择项目。

Answer 1

2小时后，这就是你想要的Demo

var maxSelectedItems = 3 ;

$("#multiselecta").kendoMultiSelect(
{
  tagMode: "single",
  maxSelectedItems: maxSelectedItems
});
var multiselect = $("#multiselecta").data("kendoMultiSelect");

$("#multiselecta").parent().find(".k-multiselect-wrap.k-floatwrap").on("click",function(e)
{
    if(multiselect.dataItems().length >= maxSelectedItems)
    {

      $("#multiselecta_listbox li").on("click",function()
      {
        if(multiselect.dataItems().length >= maxSelectedItems)
        {
          var index = $(this).attr("data-offset-index");
          var currentVal = multiselect.listView._view[index].item.value;

          if($(this).hasClass("k-state-selected"))
          {
            var indexArray = multiselect.listView._values.indexOf(currentVal);
            if (indexArray > -1) 
            {
                multiselect.listView._values.splice(indexArray,1);
            }
          }

          multiselect.close();
          multiselect.refresh();
        }
      });


      $(".k-animation-container").css(
      {
        "display":"block",
        "overflow":"visible"
      }).find("#multiselecta-list").css(
      {
        "display":"block",
        "transform": "translateY(0px)"
      });
    }
});

kendoui multiselect单标签模式最大选择无法取消选择

1 个答案: