Как мне получить основу для привязки события отправки к форме?

Я использую следующий код для создания представления:

LoginForm = Backbone.View.extend({

    tagName :"form"
    ,id : "login-form"
    ,className :"navbar-form"
    ,initialize: function () {
            this.model = new StackMob.User();
            this.render();
    }
    ,render: function () {
            $(this.el).html(this.template());
            return this;
    }
    ,events : {
            "change" : "change"
            ,"submit #login-form" : "login"
    }
    ,login : function( event) {
            event.preventDefault();
            var self = this;
            this.model.login(true, {
                    success: function( model) {
                            app.alertSuccess( "User logged in");
                            self.render();
                    }
                    ,error: function( model, response) {
                            app.alertError("Could not login  user: " + response.error_description);
                    }
            });
            event.currentTarget.checkValidity();
            return false;
    }
// rest of code

И шаблон:

<input name="username" class="span2" type="email" placeholder="Email" required >
<input name="password" class="span2" type="password" placeholder="Password" required >
<button id="login-button" type="submit" class="btn">Sign in</button>

Когда я привязываюсь к кнопке, вызывается функция входа в систему. Привязка к событию отправки формы, функция входа не вызывается. Я также могу получить форму для привязки, если тег id и form являются частью шаблона, и это не то, что я хочу сделать здесь.

Как мне привязать форму submit в этом случае?

Ответы

Ответ 1

"submit #login-form" : "login"

Я думаю, что Backbone будет искать этот идентификатор только среди потомков. Поэтому он никогда не будет соответствовать вашему собственному элементу представления. Почему бы вам просто не использовать:

"submit": "login"

Как и для изменения.
Прочитайте код магистральной системы, чтобы быть уверенным.

Edit:
Если вы установите селектор, Магистраль вызовет

this.$el.on(event, selector, method);

вместо

this.$el.on(event, method);

И метод on jQuery вместо этого применит селектор к потомкам только элемента, исключая сам элемент.

Ответ 2

Вы неправильно используете Backbone. Итак, что вы собираетесь делать,

template: my_template_string,
render: function () {
    this.el.innerHTML = this.template();
},
events: {
    "submit #login-form": function (event) {}
}

Где this.template установлено значение

<form id="login-form" class="navbar-form">
    <input name="username" class="span2" type="email" placeholder="Email" required >
    <input name="password" class="span2" type="password" placeholder="Password" required >
    <button id="login-button" type="submit" class="btn">Sign in</button>
</form>

И разве это не имеет смысла? Почему вы хотите, чтобы идентификатор и имя класса были отделены от входных элементов? Кстати, вы все равно можете сделать голый catchall на submit, но только в моем методе,

  • класс <form> и атрибут <form> привязываются к шаблону формы, а не только к основному виду,
  • Вы будете явно захватить право submit,
  • Вы можете поддерживать несколько событий отправки (в случае, если один шаблон имеет две формы).

Ответ 3

Возможно, когда вы привяжетесь к событию отправки формы, будет отправлено только сообщение, в котором будет отправлено событие "отправить". вы можете добавить код ниже и повторить попытку.

$('#id').submit(function(ev) {

});