How to disable one of the list item in PrimeReact ListBox?

[Chattanooga]

For the PrimeReact ListBox implementation:

const cities = [
{name: 'New York', code: 'NY'},
{name: 'Rome', code: 'RM'},
{name: 'London', code: 'LDN'},
{name: 'Istanbul', code: 'IST'},
{name: 'Paris', code: 'PRS'}
];

<ListBox
optionLabel="name"
optionValue="code"
value={city}
options={cities}
onChange={(e) => setCity(e.value)}
/>
I get the proper panel with the list items. But How do I disable a list item, say if New York needs to be disabled from getting selected, how can it be achieved?
yourtexasbenefits

[mert.sincan]

Hi,

Sorry for the delayed response! You can use optionDisabled propery.

Code: Select all

const cities = [
{name: 'New York', code: 'NY', disabled: true},
{name: 'Rome', code: 'RM'},
...
];

<ListBox optionDisabled="disabled"

Or

Code: Select all

const cities = [
{name: 'New York', code: 'NY},
{name: 'Rome', code: 'RM'},
...
];

<ListBox optionDisabled={(option) => {
   if (condition)
   	return true | false
}}

Best Regards,