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

UI Components for React
Post Reply
Chattanooga
Posts: 2
Joined: 28 Dec 2020, 08:45

16 Apr 2021, 12:03

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
Posts: 4710
Joined: 29 Jun 2013, 12:38

07 May 2021, 00:13

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,

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests