Backbone.js: यह घटना क्यों बंधी नहीं है?

Question

मेरे पास एक साधारण टोडो सूची है, और सभी उम्मीद के अनुसार प्रतिपादन कर रहे हैं, लेकिन जब मैं संपादन फ़ॉर्म में सबमिट बटन पर क्लिक करता हूं, तो फॉर्म सबमिट किया जाता है (GET/todo_items), और पृष्ठ को फिर से लोड किया जाता है, केवल संपादन फ़ॉर्म दिखाता है । "सबमिट फॉर्म" ईवेंट बाध्य नहीं है और मैं यह नहीं समझ सकता कि क्यों। मैं क्या खो रहा हूँ?

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

Answer 1

बैकबोन el तत्व पर प्रतिनिधियों का उपयोग करता है। यदि आप "एल" निर्दिष्ट नहीं करते हैं या अपना दृश्य प्रस्तुत करने के लिए "el" का उपयोग नहीं करते हैं, तो ईवेंट प्रतिनिधिमंडल काम नहीं करेगा।

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

इसे करने के लिए this.el के रूप में हर जगह आपके विचार कोड में, विशेष रूप से अपने प्रस्तुत करना में देखें: इसके बजाय

$("#edit_area") 

अपने प्रस्तुत करना, निर्माता में "एल" विकल्प के रूप में इसे पारित भीतर

करने का ।

Answer 2

इस के साथ monkeying के कई घंटे के बाद, यह बाद मैं स्पष्ट रूप से देखने पर el निर्धारित करते हैं, और render समारोह में $(this.el) इस्तेमाल किया काम:

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())); 
    } 
}); 

यहाँ संपादित रूप है। अजीब।