Knockout js how to find a checked radio button in a radio button list

Question

I'm having a list of contact details. User can select, add and remove those contact details.(Please see the fiddle JSfiddle ) whenever the user click an add button, a new contact model item will be add to the DOM.

var ContactModel = {

           ContactData : [
                               { 'ContactKey': 12323, 'Ref': 'Reference-Marsh', 'ContactName': 'Marsh Global' },
                               { 'ContactKey': 44234, 'Ref': 'Reference-AON', 'ContactName': 'AON Co' },
                               { 'ContactKey': 65343, 'Ref': 'Reference-Europ', 'ContactName': 'Europ Ltd' },
                               { 'ContactKey': 78555, 'Ref': 'Reference-ECB', 'ContactName': 'ECB Tradings' },
                               { 'ContactKey': 24242, 'Ref': 'Reference-Jersey', 'ContactName': 'New Jersey Inc' }
           ],

             Items: ko.observableArray(),

             MainContacts : ko.observable(),

             AddItem: function () {
                 ContactModel.Items.push(new Contact([]));
             },
             Remove: function (line) {
                 ContactModel.Items.remove(line);

             }
         }

please see the rest of the code in the fiddle

when the user click a radio button, that selected radio button line data considered as main contact.I have to save all of the line items data. this is because when the user revisited the page,I'll bring all the line item with selected main contact.

when the user change the select list, the selected item object having the properties of ContactKey,Ref and ContactName according to that the other observable are updated.

but if the radio button is selected only the main contact will be updated. I've achieved that using pure jquery. but the value radio button value binding bit confusing for me. can any one help me to sort that issue.

Answer 1

If i understood your intentions right, my modifications to the fiddle shall present you a solution, basically:

• I gave names to the radio buttons so that they are exclusive.
• I moved logic from the view to the ischecked observable that is now a computed.
• I changed the binding logic for the main contact.
• Some small tweeks that can be seen in the fiddle.

Here's the fiddle: http://jsfiddle.net/QmQy9/4/

If theres something different from what you intended, just let me know.

Regards.