Is it possible to disable resources from a dropdown (Combobox)? If so, how can this be accomplished?
Support Forum
Hello.
Combo box has a store with items which you can filter to remove them from combo. We don't have an API to disable certain items inside the dropdown list. But you can implement it on application level. e.g. add certain CSS class to certain disabled records and make them disabled with CSS:
//
combo.store.forEach((item) => {
// item is disabled
if (...) {
// set this property to add class, set to empty string to remove
item.cls = 'disabled';
}
});
// css
.b-list-item.disabled {
pointer-events: none; // this will prevent selection
background-color: gainsboro; // add some visuals to distinguish disabled items
}
Hi Jammb,
Please, post your code using "Code display" button on editor forum instead of screenshot it, will be good for us to copy when needed. Screenshots are good to show the browse result on your UI.
Please, take a look on react examples, there are many examples that can help you.
Considering you created a css like suggested by Maxim, you can apply class according your variable value, like this:
editor : {
type : 'combo',
valueField: 'name',
displayField: 'name',
items: [{
name: 'item 1'
},{
name: 'item 2'
},{
name: 'item 3'
}],
listItemTpl : item => `<div class="${disabled ? 'disabled' : ''}"></div><div>${item.value}</div>`
}
Best regards,
Fabio