So, I was trying to figure out how to bind to a form where you define a team (using first name and last name for each team member) and define the team leader using a radio control.
Here is the problem:
In the above example, you will notice that in the first box there is the form and in the second box is the values of the variables that are bound to the form. The first name and last name change values without a problem but the team leader value doesn't update properly. As you change the value, the new team leader gets a "1" but the old one isn't reset to "0".
I came up with a solution but I'm not too fond of it.
In the above example, it is laid out the same except I am now using a "selected" variable that is then bound to the radio buttons. It requires the intermediary step of the watcher.
Can anyone come up with a more elegant solution to the problem? I really don't want to have to roll with this one.
Top comments (3)
I hope this is the kind of thing you aimed for. Names update when you change them in the inputs and a 1 gets displayed next to the leader.
This also lets you easily add new users by just
.push()-ing new values into the names array. The UI should update accordingly.Let me know if I mixed something up
It isn't exactly what I'm aiming for. I'm not just looking to display a 1 for the leader. I want to have it available to pass to an API. You are correct that the team should really be in an array, though.
You could now add a watcher to that array and pass the info to your API whenever something changed. Should work out :)