How to set data attribute for Multiselect dropdown li element

[datta]

I would like to disable partly multiselect dropdown li elements on basis of specific condition. To achieve this I tried to set data attributes on li elements  and check that data while rendering these li elements and apply CSS to disable it. But neither I find any related data in data object returned by KendoMultiselect nor in documentation.

$(itemIdservicetypes).on('change', function (e) {
			// Here we can get the value of selected item
			var seletctedValueST = $(itemIdservicetypes).data("kendoDropDownList").text();
			var data = $(itemIdSIMultiSelect).data("kendoMultiSelect");

			data.ul.children().each(function () {
				if (seletctedValueST == $(this).data("ServiceType") {
					$(this).addClass("k-disabled");
				} else {
					$(this).removeClass("k-disabled");
				}
			})

		});

Appreciate your help.

 

[Georgi Denchev]

Hi, Datta,

You could use the itemTemplate to apply the data attribute to a span inside the `li` element. Then you can use the attribute to access the `li` itself.

Dojo

I've prepared a Dojo example with several comments describing the overall idea behind the logic:

https://dojo.telerik.com/@gdenchev/OVITUJIl 

Best Regards,
Georgi Denchev
Progress Telerik

[datta]

Thank you so much Georgi.

Your solution serves the purpose. But now I need to disable dropdown "li" elements during initial rendering of dropdown options that means for default selection or value, "li" elements should be disabled.

Appreciate your help.

[Georgi Denchev]

Hi, Datta,

You can use the dataBound event of the MultiSelect to disable the elements upon initialization.

Dojo

https://dojo.telerik.com/@gdenchev/amiWeHoc 

Best Regards,

Georgi