CODEWITHSUNDEEP
radio-buttonaurelia
Priyan Perera
Priyan Perera

Reputation: 560

Aurelia bind value to radio button on check change

I want to retrieve the value of the selected radio button using Aurelia. Following is my code.

<input id="account-location-1" name="account-location" type="radio" 
value.bind="Item1" checked checked.bind="accountLocation" 
click.delegate="toggle()">
<label for="account-location-1">Australian</label>

<input id="account-location-2" name="account-location" type="radio" 
value.bind="Item2" checked.bind="accountLocation" click.delegate="toggle()">
<label for="account-location-2">International</label>

export class TestApp{
accountLocation = '';
private toggle() {
    alert(accountLocation);
    return true;
}
}

The issue is accountLocation does not have the selected but is always an empty string. Any pointers as to what is wrong?

Upvotes: 1

Views: 957

Answers (2)

codeHot
codeHot

Reputation: 471

I wanted to chime in on this - as I discovered this today: the value.bind locks the value to the accountLocation value.

What you probably want to do is a model.bind which also can then automatically set the default value, and that list should come from an array.

I have a little write-up on this here (that has link to a GIST with working example), as I was having problems getting RADIO inputs to show the pre-selected value:

http://codehot.io/aurelia-model-bind-vs-value-bind/

Upvotes: 0

greensponge
greensponge

Reputation: 461

Simply remove .bind from value and it should no longer be empty:

<... 
value="Item1" 
...>
<label for="account-location-1">Australian</label>

<...
value="Item2"
...>
<label for="account-location-2">International</label>

Upvotes: 1

Related Questions