Kendo ui Multi Select使用值删除所选元素

时间:2013-07-15 12:10:34

标签: kendo-ui multi-select

我正在使用kendo ui multiple select

http://demos.kendoui.com/web/multiselect/events.html

我有这个代码

var data =
        [
            { text: "Africa", value: "1" },
            { text: "Europe", value: "2" },
            { text: "Asia", value: "3" },
            { text: "North America", value: "4" },
            { text: "South America", value: "5" },
            { text: "Antarctica", value: "6" },
            { text: "Australia", value: "7" }
        ];

var multi = $("#select").kendoMultiSelect({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: data
}).data("kendoMultiSelect");

现在我可以使用此

添加值
multi.value(["5", "3"]);

现在我想从选定的值中删除

有没有办法使用valuetext

删除值

例如,如果我想删除5,那么是否有任何方法,例如multi.remove(["5"]);

或以任何其他方式将其删除???

2 个答案:

答案 0 :(得分:4)

要以编程方式从MultiSelect中删除元素,您可以使用:

// Elements to be removed
var subtract = ["1", "5"];
// Get copy of current selected elements
var values = multi.value().slice();
// Remove elements from subtract
values = $.grep(values, function(a) {
    return $.inArray(a, subtract) == -1;
});
// Clean filtering
multi.dataSource.filter({});
// Set new values
multi.value(values);

subtract是要删除的元素(在此示例中为“1”和“5”)。

提示:要添加,您可以使用:

// Elements to add
var add = ["4", "5"];
// Get copy of current selected elements
var values = multi.value().slice();
// Merge withe elements to add
var merge = $.merge(values, add);
// Clean filtering
multi.dataSource.filter({});
// Remove duplicates and set them back
multi.value($.unique(merge));

在此处运行示例:http://jsfiddle.net/OnaBai/9WfGA/

答案 1 :(得分:0)

已经回答过了,但这可以帮助某人。我遇到了同样的问题,想删除值,但没有要删除的值。 This帮助了我。它将从下拉列表中删除所有选定的值

在页面中添加CSS类

.hide-selected > li.k-state-selected {
    display: none;
}

并将此代码添加到pageload

var multiselect= $("#select").data("kendoMultiSelect");
multiselect.ul.addClass('hide-selected');