सबमिट ईवेंट को किसी फ़ॉर्म में बाध्य करने के लिए रीढ़ की हड्डी कैसे प्राप्त करें?

Question

मैं दृश्य बनाने के लिए निम्नलिखित कोड का उपयोग कर रहा:

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> 

जब मैं बटन पर बाँध, लॉगिन समारोह कहा जाता हो जाता है। प्रपत्र जमा करने पर फॉर्म पर बाध्यकारी, लॉगिन फ़ंक्शन को कॉल नहीं किया जाता है। यदि आईडी & फॉर्म टैग टेम्पलेट का हिस्सा है, तो मैं यह भी बांधने के लिए फॉर्म प्राप्त कर सकता हूं, जो मैं यहां नहीं करना चाहता हूं।

मैं इस मामले में सबमिट फॉर्म पर कैसे बाध्य करूं?

Answer 1

"submit #login-form" : "login" 

मुझे लगता है कि बैकबोन केवल इस वंशज को वंशजों के बीच खोजेगा। तो यह कभी भी अपने स्वयं के दृश्य तत्व से मेल नहीं खाएगा। आप अभी क्यों उपयोग नहीं करते:

"submit": "login" 

जैसा कि आपने परिवर्तन के लिए किया था।
बैकबोन के कोड को बस सुनिश्चित करने के लिए जांचें।

संपादित करें:
आप एक चयनकर्ता रखते हैं, रीढ़

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

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

के बजाय

कॉल करेंगे और jQuery की विधि पर बजाय वंशजों के चयनकर्ता लागू होगी तत्व को छोड़कर केवल तत्व के।

Answer 2

आप बैकबोन गलत का उपयोग कर रहे हैं। तो आप क्या करना चाहते करने जा रहे हैं,

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> 

है कि केवल मेकअप भावना सेट और करता है नहीं क्या? आप इनपुट तत्वों से आईडी और क्लासनाम को अलग क्यों करना चाहते हैं? Btw, आप अभी भी submit पर नग्न मोहक कर सकते हैं, लेकिन केवल मेरी विधि में,

• <form> वर्ग, और <form> विशेषता
• प्रपत्र के टेम्पलेट से बंधा हो जाएगा, और न सिर्फ रीढ़ देखने के लिए, होगा आप स्पष्ट रूप से सही सबमिट कर रहे हैं,
• क्या आप कभी भी कई सबमिट ईवेंट का समर्थन कर सकते हैं (यदि एक टेम्पलेट में दो रूप हैं)।

Answer 3

शायद जब आप फ़ॉर्म सबमिट करने पर फॉर्म पर बाध्य करते हैं, तो यह केवल सबमिट सबमिट करेगा 'सबमिट' ईवेंट को आग लग जाएगा। आप नीचे कोड जोड़ सकते हैं और इसे फिर से कोशिश कर सकते हैं।

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

});