How to get new input text from form with Backbone.js

Question

I am beginner to web. I have a view as follows:

window.CreateAndEditContactView = Backbone.View.extend({
initialize: function() {
    this.init(); // loads template
},
init: function() {
    var popupWindow = $('body').append(".content"); // I used .content instead of template 
    var saveButton = popupWindow.find('#save_new_contact');
    saveButton.click(function(){

        var emailContact = popupWindow.find('#contact_email').val();
        var nameContact = popupWindow.find('#contact_name').val();
        console.log(emailContact + " : " + nameContact);
    }
}
});

My html looks like this:

<div class="content">
    <div class="write_name">
        <span class="name">Name</span>
        <input id="contact_name" type="text"/>
        <img class="avatar" src="/images/avatar2.jpg">
    </div>
    <div class="write_email">
        <span class="name">e-mail</span>
        <input id="contact_email" type="text"/>
    </div>      
        <input type="submit" id="save_new_contact" value="Save"/>
</div>

Console writes the same value all time. I can not get my new value from <input id="contact_name" type="text"/>. What am I doing wrong?

Answer 1

Your values that are logged are based on the popupWindow jquery object. I would suggest you to directly access the input values and see if its working. This is only for checking. Ensure the popupWindow is holding right div element.