Backbone.js events not working

Question

When I click a continue button, some text box should shown in a div, but it's not happening. Here is my code.

html file :

    <button class="btn btn-success pull-right" id="3continue"
                                        type="button">

my javascript file :

    events:{
          'click button#3continue': 'displayCoupon'
           },
    initialize: function(){
            var self=this;
           _.bindAll(this,'render','addProductDetails','displayCoupon'); 

            this.collection = new List();
            this.addProductDetails();
        },

   displayCoupon: function(){
      //e.preventDefault();
      console.log("in displayCoupon");
      $('#couponcheck').empty();
      $('#couponcheck').append('<div class="col-xs-8"><input  type="text" class="form-control" id="enterCoupon"></div>');
      $('#couponcheck').append('<div class="col-xs-8"><button type="button" class="btn btn-success btn-sm" id="couponbutton">Apply</button></div>');


},

Answer 1

Please try this:

Html:

 <button class="btn btn-success pull-right" id="clickMe"
                                            type="button">

Javascript:

 events:{
          'click #clickMe': 'displayCoupon'
           },
    initialize: function(){
            var self=this;
           _.bindAll(this,'render','addProductDetails','displayCoupon'); 

            this.collection = new List();
            this.addProductDetails();
        },

   displayCoupon: function(){
      //e.preventDefault();
      console.log("in displayCoupon");
      $('#couponcheck').empty();
      $('#couponcheck').append('<div class="col-xs-8"><input          type="text" class="form-control" id="enterCoupon"></div>');
      $('#couponcheck').append('<div class="col-xs-8"><button type="button" class="btn btn-success btn-sm" id="couponbutton">Apply</button></div>');


},

In your code you have written

events:{
       'click button#3continue': 'displayCoupon'
      },

try replacing above code with code given below:

 events:{
      'click #3continue': 'displayCoupon'
       },