Как мне получить основу для привязки события отправки к форме?
Я использую следующий код для создания представления:
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) {
});