New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Allow options with no value #77
Comments
Hi, Out of interest, if you pass a value to the placeholder option, does this work? If so, this will be a really easy fix. Thanks |
No, unfortunately not 🙁 |
I'm working on a fix that accepts a blank value attribute. That being said, what do you think the expected behaviour should be for placeholder items? Should they behave like disabled options or should they not appear in the dropdown list at all? Thanks :) |
That's a tough question. I think you always have to think about accessibility. Custom selects should work 100% if I drop all the javascript stuff. So what I want is a javascript and non-javascript solution to:
So maybe you don't have to change the way choices works with empty values, if the placeholder options works properly. In #53 there is a nice suggestion to fix the current issue with the placeholder option: const choices = new Choices(elements, {
placeholderValue: 'Please Choose…',
searchPlaceholderValue: 'Search…',
removeItemButton: true,
} Or maybe you could do something like this to recognize a placeholder option (the placeholder should not be in the dropdown): <select>
<option value data-choices-placeholder>Please Choose…</option>
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
</select> In general I don't think it's a good idea that placeholder items behave like disabled fields because not all selects are required fields and otherwise you are not able to un-select an already selected field. What do you think? 🤔 |
Just to jump in here, found this recently after trying to move a new project to Vue.js and loving it so far. I came from using Selectize in a previous project and I'm having a much better time. (I had to re-write the CSS but that's just because I like to make things difficult!) Jumping in with some opinions on this:
|
Thanks for all your feedback. I think I'm going to experiment with using the |
Hi, Looks like this :
I haven't any placeholder. The current value is always selected for the filter. |
Will be watching this one closely, great ideas everyone! |
Plan:
|
👍 |
@jshjohnson Any testing I can do to help out with this one? Thanks! |
Hi @zslabs, I'm uber busy at the moment at work - I don't think I'm going to make much progress on this until after New Year. I'm happy to review any pull requests though. Apologies! |
@jshjohnson Hello did you you have time since your last comment? |
I have implemented all parts of this feature besides forcing a placeholder to appear first in the choice list. Experiment on the following branch: |
I'm looking forward to this update! Glad to see its being actively worked on. |
So, what needs to happen to get this done? I am willing to help with this if it's possible. |
Hi @adammockor, See my comment here: #77 (comment) Any help would be appreciated :D |
Thanks to @adammockor, placeholders are now appearing first! It would be really good if people could test Thanks |
So maybe some kind of prerelease could help with testing? |
Good idea, pre-release can be found here: https://github.com/jshjohnson/Choices/releases/tag/v3.0.0-beta |
I was thinking more like npm release. Although you can point |
Hey @jshjohnson, Looking at the new release will it be possible to set a placeholder via the config object passed to Cheers. |
@CrashyBang You can do that already via the |
Hey @jshjohnson, Sorry I should have explained myself a little better, I am currently using the What I am after is the Cheers. |
@CrashyBang Ah I see what you mean. There was a good suggestion here to make a new config option where you can define the placeholder of the search input separately. I'll look into this! |
Hi there! Is there any progress on this issue? Being able to set the Best regards, |
We also may need this pull request, which provides a pseudo-placeholder for single selects. |
Hey, I want to use an option with no value as a placeholder. But this doesn't work. The option will not be visible with choices.js.
The select is empty and I'm not able to select this field anymore.
This is valid HTML so I'm a bit confused why this isn't working.
The text was updated successfully, but these errors were encountered: