How to disable dropdown "li" elements during initial rendering of dropdown options that means for default selection or value, "li" elements should be disabled.

[datta]

Extension of below question  

For reference link bellow: https://www.telerik.com/forums/how-to-set-data-attribute-for-multiselect-dropdown-li-element#5647546

[Neli]

Hi,

To disable an item in the DropDownList you can use a template and add the k-disable class (the first example in the Dojo linked below). 

template: '<span class="#: isDeleted ? \'k-disabled\': \'\'#">#:name# </span>'

If you need to disable the 'li' element you can still use a template to add a custom class. Then when the DropDownList gets opened you can find the wrapping li element and disable it using css (second example in the Dojo linked below).

open: function(e){
          setTimeout(function(){            
            $('.custom').closest('.k-list-item').addClass('custom2')            
          })
 },

<style>
      .custom2 {
        pointer-events:none; 
        opacity:0.6;         
      }
 </style>

Here is a Dojo example that demonstrates both approaches.

Let me know in case you have additional questions.

Regards,
Neli
Progress Telerik