Skip to content
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

v-model on checkboxes inside button group #177

Open
crowincage opened this issue May 30, 2018 · 2 comments
Open

v-model on checkboxes inside button group #177

crowincage opened this issue May 30, 2018 · 2 comments

Comments

@crowincage
Copy link

I try to implement a simple button group with checkboxes to define an address type.
The model looks like this:

{ ... isClient: boolean, isSupplier: boolean, isManufacturer: boolean, ... }

If I use the button group like this with checked = []

<button-group v-model="checked"> <checkbox name="isClient"> Client </checkbox> <checkbox name="isSupplier"> Supplier </checkbox> <checkbox name="isManufacturer"> Manufacturer </checkbox> </button-group>

it's not possible to check a single button. If I check for example the isClient checkbox all types are set to true - not just the client checkbox which is expected.

If I use v-model on the checkboxes directly

<button-group> <checkbox v-model="address.isClient" name="isClient"> Client </checkbox> <checkbox v-model="address.isSupplier" name="isSupplier"> Supplier </checkbox> <checkbox v-model="address.isManufacturer" name="isManufacturer"> Manufacturer </checkbox> </button-group>

only selected checkboxes are set to true - which is the desired behaviour - but I got an javascript error in the console because checkbox is trying to update the parent (Cannot read property 'indexOf' of null).

So I see no way to implement this case without javascript error.
Any suggestions please?

@gswilcox01
Copy link

Read the docs. Example there works. I think button-group has v-model, then each checkbox has a true-value attribute.

@crowincage
Copy link
Author

Of course I've read the (sadly often incomplete) docs @gswilcox01 !

If you've read my question you could see that I'm trying to bind a different model - which simply is not possible in this way. Used a hack.

thanks anyway!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants