How to add new item in Kendo MultiSelect in MVC?

856 Views Asked by At

Does anybody know how to add new items in Kendo MultiSelect? though I've tried so many of answers which are available on internet & forums. But, its not working for me now. When I'm trying to add new item with existing code then undefined items getting added only. I want to POST new added items to controller on submit button. Can anybody give proper working solution for this?

View:

   @(Html.Kendo().MultiSelectFor(model => model.AlternateNames)
                             .HtmlAttributes(new { @style = "width:100%" })
                             .AutoClose(true)
                             .DataTextField("Text")
                             .DataValueField("Value")
                             .BindTo(Model.AlternateNamesList)
                             .Events(e => { e.Change("change").DataBound("dataBound"); })
                     )

JS Code:

function change() {
    var value = this.value().slice(0);
    var dataitems = this.dataSource.data();
    var newtag = "";
    for (var i = 0; i < dataitems.length; i++) {
        var dataItem = dataitems[i];
        if (dataItem.text.substring(0, "Add new tag: ".length) === "Add new tag: ") {
            newtag = dataItem.text.replace("Add new tag: ", "");
            this.dataSource.remove(dataItem);
        }
    }
    if (newtag != "") {
        this.dataSource.add({ text: newtag, value: newtag });
    }
    if (newtag) {
        this.dataSource.filter({});
        if (this.value().length == 1) {
            this.value(newtag);
        }
        else {
            value.push(newtag);
            console.log(value);
            this.value(value);
        }
    }
}
var newitemtext = '';
function dataBound() {
    if ((newitemtext || this._prev) && newitemtext != this._prev) {
        newitemtext = this._prev;
        var dataitems = this.dataSource.data();
        var isfound = false;
        for (var i = 0; i < dataitems.length; i++) {
            var dataItem = dataitems[i];
            if (newitemtext != "" && newitemtext != "undefined") {
                if (dataItem.text == newitemtext) {
                    dataItem.text = newitemtext + "% ";
                    this.refresh();
                    isfound = true;
                }
            }
        }
        if (!isfound) {
            if (newitemtext != "" && newitemtext != "undefined") {
                alert(newitemtext);
                this.dataSource.add({ text: newitemtext + "% ", value: newitemtext + "% " });
                this.refresh();
            }
        }
        this.search();
        this.open();
    }
}
0

There are 0 best solutions below