The next step is to allow users to edit their event records. Wiring up our edit button will be simple. First, we listen for the click in the events
object of EventView
, like this:
"click .edit": "edit"
And secondly, we navigate to the edit route for that event:
edit: function (evt) { evt.preventDefault(); this.nav("/edit/" + this.model.get("id"), { trigger: true }); }
We want our edit routes to act just like our create route does. If the user clicks on an edit button, a modal will fade in and allow editing of the event records. But they should also be able to go directly to the edit route and the table will load under the modal. This means that our router's edit
method should be very similar to its create
method.
First, we'll add the route to the router's route
object as follows:
'edit/:id': 'edit'
Then, the edit
method itself using the following code:
edit: function (id) { var ev = new EditEventView({ model: this.events.get(parseInt(id, 10)), nav: this.nav ...