Backbone.js: Почему это событие не связано?

У меня есть простой список задач, и все они отображаются как ожидалось, но когда я нажимаю кнопку отправки в форме редактирования, форма отправляется (GET/todo_items), и страница перезагружается, а только показывает редактирование форма. Событие "отправить форму" не связано, и я не могу понять, почему. Что мне не хватает?

App.Views.Edit = Backbone.View.extend({
  events: {
    "submit form": "save"
  },
  initialize: function(){
    this.render();
  },
  save: function(){
    var self = this;
    var msg  = this.model.isNew() ? 'Successfully created!' : 'Saved!';

    this.model.save({
      title: this.$('[name=title]').val(),

      success: function(model, resp){
        console.log('good');
        new App.Views.Notice({message: msg});
        self.model = model;
        self.render();
        self.delegateEvents();
        Backbone.history.saveLocation('todo_items/'+ model.id);
        $('#edit_area').html('');
      },
      error: function(){
        console.log('bad');
        new App.Views.Error();
      }
    });

    return false;
  },
  render: function(){
    $('#edit_area').html(ich.edit_form(this.model.toJSON()));
  }
});

Здесь форма редактирования:

<script id="edit_form" type="text/html">
  <form>
    <label for="title">Title:</label>
    <input name="title" type="text" value="{{title}}" />
    <button>Save</button>
  </form>
</script>

Ответ 1

Магистраль использует элемент delegateEvents для элемента el. Если вы не укажете "el" или не используете "el" для рендеринга вашего представления, делегирование событий не будет работать. Вместо того, чтобы делать

$("#edit_area") 

внутри рендера, передайте его как опцию "el" в конструкторе:

edit = new App.Views.Edit({el: $("#edit_area")})

Обратитесь к этому как this.el везде в вашем коде просмотра, особенно в вашем рендере.

Ответ 2

После многих часов обезьяны с этим он работал после того, как я явно установил el в представлении и использовал $(this.el) в функции render. Weird.