I'm making a web form for editing some objects. I'll call these objects Foos.
I have a Backbone model that represents Foos. I have a Backbone view that renders an editor form, filling in fields based on the state of the Foo model it is given.
My goal is to keep the Foo model in sync with the form fields.
Idea 1: I could wire up
onchange listeners on all of the input boxes. Whenever the user changes a field, the model would be immediately updated.
Manually adding an event listener to each input box seems excessive, though.
Idea 2: I could add an
updateModel method to my view. Calling this method would inspect the form fields and bring the model up to date.
The problem with this is that if you forget to call
updateModel, you will be working with a stale model.
What are some best practices for syncing a Backbone model with its user-editable view?