coreui-vue
coreui-vue copied to clipboard
CFormSelect does not respect option of value 0 or empty
When setting up a form with the CFormSelect, on v4.3.1 as noted here: https://coreui.io/vue/docs/forms/select.html, if a value is 0 or empty it is ignored and the value becomes the label when selected. I am wanting to have a simple Select Option in the drop down and when I run form validation it is easily check that it is empty. Currently I have to set some other invalid value I don't what to use, like '0' works, 0 as a string but not as an int. Also tried it with null and it is ignored as well.
Example:
<CFormSelect
v-model="selectItem"
:options="[
{label: 'Select options', value: ''},
{ label: 'One', value: '1' },
{ label: 'Two', value: '2', selected: true },
{ label: 'Three', value: '3', disabled: true }
]">
</CFormSelect>
...
data: {
selectItem: ''
}
If the user selects an option and then selects the "Select options" value it should set the related selectItem to empty, but it sets it to the value of the label. Now when the user clicks the button to submit the form it looks like they did select a value because selectItem does have a value. If you set the value to zero, 0 as an int it will also be ignored and the selectItem becomes the related label.
My temporary fix is that I set the first option like so: {label: 'Select options', value: '0'}, where the value is not a string 0. Then my form validation does if (selectItem === '0') { /* error */ }
Don't think it is a browser issue, but I am on FireFox on Mac OS and Ubuntu.
Thanks for review and this project!
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions
Issues shouldn't be closed without any response from maintainers. So bot leave it open.