Come si ottiene il valore dei dati immessi dall'utente?

Question

Dire che ho un sito Web con alcuni campi su cui voglio eseguire alcuni calcoli. Ho un input di quantità e nella mia backbone.js View ho associato l'evento "change" a questo input.

Come si ottiene il valore delle modifiche nel campo di immissione?

Ho trovato questo metodo (sotto) per ottenere il valore, ma è sbagliato visto che devo conoscere nuovamente l'ID elemento nella mia funzione. Ad esempio, non potrei farlo con una lezione.

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}); 
    } 

}); 

E nel codice HTML:

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

Am I avvicinarsi a questo in modo corretto? Esiste una variabile che accede all'oggetto che è stato modificato? So che $ (this.el) non lo è, è solo il contenitore.

Answer 1

jQuery invia un oggetto event alla funzione changeQuantity. Con esso, è possibile recuperare l'input modificato.

window.Calculations = Backbone.View.extend({ 

    //(...) 

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


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

}); 

ho creato un jsfiddle come esempio: http://jsfiddle.net/tz3XS/138/

Answer 2

è necessario utilizzare la target della manifestazione, che si può prendere come argomento della funzione di callback. (ho dovuto aggiungere del codice me stesso per farlo funzionare, dal momento che non ci hanno dato il codice del modello ho sostituito con window.CalcModel (un modello vuoto))

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 = nuova finestra. Calcoli ({modello: nuovo CalcModel(), el: '#myView'});

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