Paste in MultSelect Error

[Mina]

I have a multiSelect and want to have paste to select, nut some times I am getting this error, 

Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.

function ParsePaste(inputSent) {

try {

//console.log($(CtrlName).data("kendoMultiSelect").dataSource.data().length);
var originalArray = $(CtrlName).data("kendoMultiSelect").value();
var pidArray = inputSent.val().trim().replace(/\s*,\s*|\s*;\s*|\s+/g, ",").split(",");

if (originalArray.length >= 1) {
for (var i = 0; i < originalArray.length; i++) {
pidArray.push(originalArray[i]);
console.log(pidArray);
}
}
inputSent.val("");
setTimeout(function () {
try {
$(CtrlName).data("kendoMultiSelect").value(pidArray);
} catch (ex) {
alert('try again!');
console.log(ex); 
}
setTimeout(function () {
try {
var newArray = $(CtrlName).data("kendoMultiSelect").value();
Array.prototype.diff = function (a) {
return this.filter(function (i) { return a.indexOf(i) < 0; });
};
if (pidArray.diff(newArray).length > 0) { aeriesWin.prototype.alert(pidArray.diff(newArray) + " not found!"); }

} catch (ex) { alert('try again!'); }
}, 250);

}, 200);
} catch (ex) {
//alert("2:" + ex);
alert('try again!');
}
}


$(function () {

$(document).on('paste', '.k-multiselect-wrap input:visible', function (e) {

setTimeout(function (e) {

ParsePaste($('.k-multiselect-wrap input:visible'));
}, 50);
});

$(document).on('keyup', '.k-multiselect-wrap input:visible', function (e) {

if (e.which == 13) {
var originalArray = $(CtrlName).data("kendoMultiSelect").value();
 originalArray.push($(this).val());
setTimeout(function () {
$(CtrlName).data("kendoMultiSelect").value(originalArray);
}, 250);
}

});
// $("#" +  ).siblings("div").find("input[aria-owns^=" +msStudents+"]").keyup(function (e) {
//if (e.which == 13) {
//alert('xxx');
//}

//});

})

[Mina]

try {
$(CtrlName).data("kendoMultiSelect").value(pidArray);
} catch (ex) {
alert('try again!');
console.log(ex); 
}

[Mina]

@(Html.Kendo.MultiSelect().Name(CtrlName) _
.HtmlAttributes(New With {.style = "width: " + Width + ";display:inline-block;"}) _
.DataTextField("ID") _
.DataValueField("ID") _
.HeaderTemplate("<div class='dropdown-header k-widget k-header'><span class='col stu_col1'>ID</span><span class='col stu_col2'>Last Name</span><span class='col stu_col3'>First Name</span><span class='col stu_col4'>Middle</span><span class='col stu_col5'>Grade</span><span class='col stu_col6'>Gender</span></div>") _
.ItemTemplate("<div class='dropdown'><span class='k-state-default col stu_col1 '>#:ID#</span><span class='k-state-default col stu_col2'>#:LastName#</span><span class='k-state-default col stu_col3'>#:FirstName#</span><span class='k-state-default col stu_col4'>#:MiddleName#</span><span class='k-state-default col stu_col5'>#:Grade#</span><span class='k-state-default col stu_col6'>#:Gender#</span></div>") _
.FooterTemplate("").Filter("contains") _
.MaxSelectedItems("900").Placeholder("Enter Student names or IDs...(type 3 char at least)") _
.Events(Sub(e) e.Open("onOpen").Filtering("onFiltering")) _
.AutoBind(True).MinLength(3).Delay(0).HighlightFirst(True) _
.DataSource(Sub(source)
source.Read(Sub(read)
read.Action("GetAllActiveStudentsForSchool", "StudentWidgets", New With {.Area = "Widgets"})
End Sub) _
.ServerFiltering(False)

End Sub))

[Dimitar]

Hi Mina,

There is an existing forum thread where implementing a similar functionality to the one described is discussed in greater details:

• https://www.telerik.com/forums/extending-multiselect-to-capture-paste-event

As the MultiSelect widget does not provide a built-in option to handle this, I would suggest utilizing the approach provided in the last response of the above-linked thread. With it, when a text is pasted in the MultiSelect and if some of the separated values are existing in the widget data source, then they are being selected. 

The above can also be observed in the following Dojo example:

• https://dojo.telerik.com/eKOxovaW

To test is, simply copy the following text "0001X, 0003X, 0005X" and paste it in the MultiSelect. As a result, the corresponding values are being selected in the widget.

Regards,
Dimitar
Progress Telerik

[Mina]

I saw it, it didn't work. when I paste it, just showing a message "data pasted".

[Mina]

It works if paste one at a time, I want to paste more than one item separated by comma or semicolon. 

[Dimitar]

Hello Mina,

Here is an updated Dojo example where the alert is removed:

• https://dojo.telerik.com/eKOxovaW/3

With it, when a comma separated values are pasted in the MultiSelect, if there are corresponding data items in the widget data source, then the items are selected. To test this, simply copy the following:

0001X, 0003X, 0005X

and then paste it in the MultiSelect. As a result, the three values will be selected.

Regards,
Dimitar
Progress Telerik

[Mina]

Thank you So much.