knockoutjs bind multiple input elements to one observable

Question

I would like to bind two or more input elements to one observable property of the viewModel.

For example, I might have a property called Telephone number which consists of Area code and number. I would like to show two textboxes for user input and it would update single observable in the viewmodel (it may be stored as comma separated string or array). I don't want to have multiple property and then have a computed property for telephone number because I don't know how many textboxes will be displayed to user for input (generated dynamically using template).

Is it possible to achieve? Thanks!

EDIT: Here is the fiddle for better understanding http://jsfiddle.net/amitava82/wMH8J/2/

Answer 1

If your data is combined into one observable, you need somethign to parse or split them out. One way is to use computeds. If you wanted 3 (just picking a number) textboxes for phone number and they all point to 1 phone number observable, you could create read/write computed properties for the parts and bind those to the input textboxes. For example, the area code textbox would be bound to a computed called areacode which reads the first 3 chars of the phone number. Its writeable aspect would simply write those 3 back to the phonenumber observable.