Jak uzyskać szkielet do wiązania zdarzenia submit do formularza?

Question

Używam poniższy kod, żeby utworzyć widok:

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 

a szablonu:

<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> 

Kiedy wiążę na przycisku, funkcja logowania jest wywoływana. Wiązanie w zdarzeniu składania formularza powoduje, że funkcja logowania nie jest wywoływana. Mogę również uzyskać formularz do powiązania, jeśli identyfikator formularza & jest częścią szablonu, co nie jest tym, co chcę tutaj zrobić.

W jaki sposób mogę powiązać formularz w tym przypadku?

Answer 1

"submit #login-form" : "login" 

myślę Backbone będzie poszukać wśród id tylko potomkom. Więc nigdy nie będzie pasować do twojego własnego elementu widoku. Dlaczego po prostu nie użyjesz:

"submit": "login" 

Tak jak w przypadku zmiany.
Sprawdzę kod kręgosłupa, aby się upewnić.

Edit:
Jeśli umieścisz selektor, Backbone wezwie

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

zamiast

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

A na metody jQuery zamiast tego zastosować przełącznik do potomkom tylko tego elementu, z wyłączeniem samego elementu.

Answer 2

Używasz nieprawidłowego Backbone. Więc co pan będzie chciał zrobić,

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

Gdzie this.template jest ustawiony na

<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> 

i nie tylko, że sens? Dlaczego chcesz, aby identyfikator i nazwa klasy były oddzielone od elementów wejściowych? BTW, można jeszcze zrobić nagą Wyłapywanie na submit, ale tylko w moim metoda będzie

• klasa <form> i atrybut <form> być przywiązane do szablonu formularza, a nie tylko widok szkieletowej,
• będzie jawnie przechwytujesz prawidłowy,
• , czy możesz obsługiwać wiele zdarzeń przesyłania (w przypadku, gdy jeden szablon ma dwa formularze).

Answer 3

Być może Po związaniu w formularzu zgłoszenie zdarzenia, jest ono wysyłane tylko w formie, która wywoła zdarzenie "wyślij". możesz dodać poniższy kod i spróbować ponownie.

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

});