CODEWITHSUNDEEP
javascriptjquerybackbone.jsbackbone-events
lorenzoid
lorenzoid

Reputation: 1832

Backbone JS event not firing

I'm having trouble getting backbone events working. I simply want to simulate a form submission and get an alert, but I can't seem to get there...

My markup is as follows:

<form method="post" id="userSignIn">       
   <label>Email</label> 
   <input type = "text" name = "useremail" value = "" id="userEmail"> 

   <br />

   <label>Pass</label>
   <input type = "password" name = "userpass" value = "" id="userPassword">

   <br /><input type = "submit" value = "Submit">
</form>

My JS

var events = _.clone(Backbone.Events);

var SigninModel = Backbone.Model.extend({
    url: 'http://localhost/api/app/User.php',
});

var SignInCollection = Backbone.Collection.extend({
    model: SigninModel
})

var SigninView = Backbone.View.extend({
    events: {
        'submit #userSignIn': 'signIn'
    },

    initialize: function() {
        console.log('Sign in view initialized');
    },

    signIn: function(e) {
        alert("Your username is" + $('#userSignIn #userEmail'));
        e.preventDefault();
    }
});

$(document).ready(function(){
    var signInCollection = new SignInCollection();
    new SigninView({ el: $('#userSignIn'), collection: signInCollection });
});

Upvotes: 0

Views: 572

Answers (1)

Robert Levy
Robert Levy

Reputation: 29073

Backbone.View.events will only look for events triggered by DOM elements that are part of the view's element (or a child of that element). Ideally you'd render this HTML via the render method on the view but an alternate approach would be to call setElement from inside SignInView.initialize

Upvotes: 2

Related Questions