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

Two-way binding for grouped radio inputs #311

Closed
Rich-Harris opened this issue Feb 28, 2017 · 2 comments
Closed

Two-way binding for grouped radio inputs #311

Rich-Harris opened this issue Feb 28, 2017 · 2 comments
Milestone

Comments

@Rich-Harris
Copy link
Member

Via #10 / #309. In Ractive, you could do this:

<label>
  <input type="radio" value="Alpha" name='{{selected}}' />Alpha
</label>

<label>
  <input type="radio" value="Beta" name='{{selected}}' />Beta
</label>

<label>
  <input type="radio" value="Gamma" name='{{selected}}' />Gamma
</label>

<p>selected: {{selected}}</p>

The name='{{selected}}' sort of makes sense, in that a shared name identifies the radios as belonging to the same group, but only sort of, since you're not actually binding to the name.

A possible alternative — keen to hear what people think:

<label>
  <input type="radio" value="Alpha" name='whatever' bind:group='selected' />Alpha
</label>

In other words, selected would take the value of whichever radio in the group of those with name='whatever' was checked.

@Rich-Harris Rich-Harris added this to the ASAP milestone Mar 1, 2017
@Conduitry
Copy link
Member

How is bind:xxx currently handled for non-components (i.e. for regular elements)? The docs mention bind:[attribute] but does it even make sense currently to talk about anything other than bind:value? I was initially worried about bind:group being a special case just for the name group but then realized that probably every different bind:xxx is going to be a special case on regular elements.

@Rich-Harris
Copy link
Member Author

There's also bind:checked. Should probably do some validation to make sure that no-one's doing daft stuff like <input bind:potato> or <div bind:value> — could be a compile-time error

Rich-Harris added a commit that referenced this issue Mar 17, 2017
Rich-Harris added a commit that referenced this issue Mar 17, 2017
implement bind:group for radio input groups
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