बैकबोन व्यू में एल पर एक घटना को ट्रिगर करना

Question

मेरे पास एक ऐसा दृश्य है जो एक चयनसूची बनाता है और पॉप्युलेट करता है। मैं परिवर्तन ईवेंट पर एक घटना बाध्य करने के लिए (उपयोगकर्ता एक अलग विकल्प का चयन करता है चाहता हूँ

यह बस इस के करीब कुछ आउटपुट:।

<select> 
    <option value="id">ID Name</option 
</select> 

---

दृश्य:

App.Views.SessionList = Backbone.View.extend({ 
    tagName: 'select', 
    id: 'sessionList', 
    events: { 
     'change': 'selectionChanged' 
    }, 
    initialize: function() { 
     // Load Collection 
     _.bindAll(this, 'selectionChanged'); 

     this.template = _.template($('#optionsTemplate').html()); 
     this.Sessiontemplate = _.template($('#session_template').html()); 
     this.SelectedSessiontemplate = _.template($('#selected_session_template').html()); 

     // Create Collection 
     this.SessionList = new App.Collections.SessionList(); 

     // Set Bindings 
     this.SessionList.bind('add', this.addSession, this); 
     this.SessionList.bind('reset', this.addSessions, this); 


     this.render(); 

     this.SessionList.fetch(); 
    }, 
    render: function() { 

     return this; 
    }, 
    addSession: function (item, num) { 
     if (num === 0) { 
      $(this.el).append(this.SelectedSessiontemplate(item.toJSON())); 
      console.log("Selected"); 
     } 
     else { 
      $(this.el).append(this.Sessiontemplate(item.toJSON())); 
     } 
    }, 
    addSessions: function() { 
     var self = this; 
     // Add all Rows 
     for (var i = 0; i < self.SessionList.models.length; i++) { 
      this.addSession(self.SessionList.models[i], i); 
     } 
    }, 
    selectionChanged: function (e) { 
     var field = $(e.currentTarget); 
     var value = $("option:selected", field).val(); 
    } 
}); 

सत्र टेम्पलेट बस बस है:

<option value="{{Id}}">{{Name}}</option> 

घटना कभी ट्रिगर नहीं होती है, और ऐसा लगता है कि यह सही ढंग से बाध्य नहीं हो रहा है। मैं इसे चुनिंदा सूची में बदलने के लिए ट्रिगर करना चाहता हूं।

मैंने मूल रूप से सोचा कि मुझे एक समस्या हो सकती है: backbone.js events and el, हालांकि यह इस मामले में काम नहीं करता है।

Answer 1

आपकी समस्या को सीधे डीबग करना मुश्किल है, क्योंकि हमारे पास सभी जानकारी नहीं है (SessionList जैसा दिखता है ... टेम्पलेट्स इत्यादि)।

लेकिन, मैंने कुछ उदाहरण के लिए अपना उदाहरण जोड़ा है जहां घटना वास्तव में काम करती है। उम्मीद है कि आप इसे वहां से बना सकते हैं? आप fork the jsFiddle कर सकते हैं यदि आप ऐसे स्थान पर जाना चाहते हैं जहां यह आपके लिए विफल रहता है और हम आगे की सहायता करने की कोशिश कर सकते हैं।

window.App = { Views: {} }; 

App.Views.SessionList = Backbone.View.extend({ 
    tagName: 'select', 

    events: { 
     'change': 'selectionChanged' 
    }, 

    initialize: function() { 
     _.bindAll(this, 'selectionChanged'); 
     this.render(); 
    }, 

    render: function() { 
     $(this.el).append('<option value="foo">Option 1</option>'); 
     $(this.el).append('<option value="bar">Option 2</option>');     
     return this; 
    }, 

    selectionChanged: function (e) { 
     var value = $(e.currentTarget).val(); 
     console.log("SELECTED", value); 
    } 
}); 

var view = new App.Views.SessionList(); 
$("body").append(view.el); 

उस कोड को देखते हुए, जब भी आप कोई आइटम चुनते हैं तो आपको मूल्य के साथ एक कंसोल लॉग मिलेगा।

चूंकि आपको यह नहीं मिल रहा है, मुझे लगता है कि आप अपवाद देख रहे हैं या ऐसा कुछ? क्या आपका डीबगर आपको कोई संकेत देता है?

शुभकामनाएं!