jakezatecky / react-dual-listbox

A feature-rich dual listbox for React.
https://jakezatecky.github.io/react-dual-listbox/
MIT License
110 stars 59 forks source link

Required props need to be added. How to set required list box so user need to select at-least one option #52

Closed AbhaysinghBhosale closed 2 years ago

AbhaysinghBhosale commented 5 years ago

I want to set the list-box to be selected as required. If user does not move any of the item in selected list then form should not be submitted.It should be like we use in select box to show required field.

jakezatecky commented 5 years ago

This should be easy to add.

jakezatecky commented 5 years ago

On second glance, this is not so trivial to add due to "required" in the case of this component means that values must exist in the "selected" list box. The browser would think required means having a selection in the rightmost box, but that is not what we necessarily want.

While I could relatively easily add in the logic to make the component show a required message when the form goes from valid to invalidate state, it is much harder to capture (and indeed, prevent) the situation of where a form is submitted and no selections have been made. Under the hood, this component uses a hidden input element and according to the HTML spec hidden inputs cannot be validated (or have the "required" property). There are ways to work around this, but they may require a little more effort.

AbhaysinghBhosale commented 5 years ago

@jakezatecky Yes we don't want to add required to the right box. We want to check that user have moved at-least one option from left to right. In my case ask have radio with 1) All option 2) Selected option , now in case of radio selected option user should be forces to select a option OR select first radio 'All options'