¿Cómo obtengo el valor de los datos ingresados ​​por el usuario?

Question

Supongamos que tengo un sitio web con algunos campos sobre los que quiero ejecutar algunos cálculos. Tengo una entrada de cantidad, y en mi backbone.js View Ataron el evento "change" a esta entrada.

¿Cómo obtengo el valor de los cambios en el campo de entrada?

Encontré este método (a continuación) para obtener el valor, pero se siente mal ya que tengo que saber el ID del elemento de nuevo en mi función. No podría hacer esto con una clase, por ejemplo.

window.Calculations = Backbone.View.extend({ 

    (...) 

    events: { 
     'change input#quantity': 'changeQuantity' 
    }, 


    changeQuantity: function() { 
     var val = $(this.el).find('input#quantity').val(); 
     this.model.set({'quantity': val}); 
    } 

}); 

Y en el código HTML:

<input type="text" id="quantity" value="<%= quantity %>"> 

Am I acercarse a esto correctamente? ¿Hay alguna variable que acceda al objeto que se modificó? Sé que $ (this.el) no es, es solo el contenedor.

Answer 1

jQuery envía un objeto event a su función changeQuantity. Con él, puede recuperar la entrada modificada.

window.Calculations = Backbone.View.extend({ 

    //(...) 

    events: { 
     'change input#quantity': 'changeQuantity' 
    }, 


    changeQuantity: function(e) { 
     var val = $(e.currentTarget).val(); 
     this.model.set({'quantity': val}); 
    } 

}); 

he creado un jsFiddle como ejemplo: http://jsfiddle.net/tz3XS/138/

Answer 2

usted tiene que utilizar el target del evento, que se puede recuperar como argumento de la función de devolución de llamada. (he tenido que añadir algo de código a mí mismo para hacer que funcione, ya que no nos dio el código del modelo i sustituido con window.CalcModel (un modelo vacío))

window.CalcModel = Backbone.Model.extend({}); 

window.Calculations = Backbone.View.extend({ 

    events: { 
     'change input#quantity': 'changeQuantity' 
    }, 

    initialize: function() { 

    }, 

    changeQuantity: function(evt) { 
     var val = $(evt.target).val(); 
     this.model.set({'quantity': val}); 
     $(this.el).find('#result').text('new value = ' + val); 
    }, 

    render: function() { 

    } 

}); 

var c = nueva ventana. Cálculos ({modelo: nuevo CalcModel(), el: '#myView'});

ejemplo http://jsfiddle.net/saelfaer/uxHLL/