Get the specific element changed in a table

Question

I am trying to get a specific value in a table of input fields, but I always get the first element instead of the clicked/changed element. I am using backbone.js to create tables out of each model. The table is created seperate. The part, which has to be changed/modified is marked in the code "Model view".

Here is the model:

DiagnoseApp.Models.Param_4_5_item   = Backbone.Model.extend({
    defaults: {
        data_type: "",
        val_param_4_5: [], //[1,2,3,4,..]
        Amount:"",
        Desc_D:"", 
        Id:"",
        Number:"",
        Type:"",
        Unit:""  
    }
}); 

Here is "model view" part, where I want to get the specific element:

Model view

    DiagnoseApp.Views.Param_5_item   = Backbone.View.extend({
        tagName:    'tr', 
        newTemplate: _.template($('#item-template5').html()), 
        initialize: function() {  this.render();  },
        render: function() {

            for(var i=0; i<500;i++){ //table with 500 colums initalize with 0s
                var getValonIndex = this.model.attributes.val_param_4_5[i];
                this.$el.append('<tr>'+this.newTemplate({Number:i, val_param_4_5_on_Index:getValonIndex})+'</tr>');
            }
        return this;
        },
        events: {
            'blur .edit' :      'editParam',
            'keypress .edit' :  'updateOnEnter'
        },
        updateOnEnter: function(e){
            if(e.which == 13){    
              this.editParam();    
            }
          },
        editParam: function(){

//*********************************************************************
//******************** What do I need to change here to get the current input field and not the first one??
            this.input = this.$('.edit'); //THIS IS PROBABLY WRONG??!!?

            var newValue = this.input.val().trim();
            alert(newValue); 
//*********************************************************************
            //Do some stuff..
        }
    }); 

Here is the dynamic generated table:

 <section id="main"  >
      <table id="table_param1"><thead id="table_thead_param1"><tr id="head_param1"><th>Nr: </th><th>Value</th></tr></thead><tbody id="body_param1">
    <tr> 
    <td>0</td> <td><input type="text" class="edit" id="new-value" id_nummer="0" value="0"></td>
    </tr>
    <tr> 
    <td>1</td> <td><input type="text" class="edit" id="new-value" value="0"></td></tr>
    <tr> 
    <td>2</td> <td><input type="text" class="edit" id="new-value" value="0"></td>
    </tr>
    <tr> 
    <td>3</td> <td><input type="text" class="edit" id="new-value"  value="0"></td>
    </tr>
....
         </table>    
    </section>

Here is the template for each column in the table:

<script type="text/template" id="item-template5"> 
    <td><%- Number %></td>
    <td><input type="text" class="edit" id="new-value" id_nummer="<%- Number %>" placeholder=0 size=8 value="<%- val_param_4_5_on_Index %>"></td>
</script> 

Answer 1

try to get target element use this code:-

    editParam: function(e){
        this.input = $(e.target); 
        var newValue = this.input.val().trim();
        alert(newValue);

    }