Javascript Jquery on one of the multiple input fields changed

Question

Lets say I have multiple input fields like distance, fuelConsumption, pricePerGallon and I need to calculate total price. But I want to calculate as the user types. So the total price need to be recalculated if any of those inputs changed. To get the single value of the field I use:

$("#form_distance").on('change paste keyup input', function() {
   var distance= $(this).val(); 
});
$("#form_fuelConsumption").on('change paste keyup input', function() {
   var fuelConsumption= $(this).val(); 
});

and so on but how do I check not the single field but multiple fields?

$("input[type=text]").on(change..... – Fahad Khan Sep 25 '14 at 17:50 — Fahad Khan, Sep 25 '14 at 17:50

score 4 · Accepted Answer · answered Sep 25 '14 at 17:50

4

This would be a possible solution:

$("#form_distance, #form_fuelConsumption").on('change paste keyup input', function(){
    var distance = $("#form_distance").val();
    var fuelConsumption = $("#form_fuelConsumption").val();
    ...

answered Sep 25 '14 at 17:50

DWK

102
1
4

score 0 · Answer 2 · edited Aug 08 '17 at 05:30

Put all input field ids like the below

  obj=["distance","fuelConsumption"];//add more input field names

iterate over the loop

 jQuery.each(det[ele], function(index, value) {

            //Your form field id is like "form_distance"

            var str="#form_"+value;

            $(str).on('change paste keyup input', function() {

                var inputfieldval=$(this).val();

                //do here whatever you want

            });

});

Put the above code into

either $(document).ready(function() { }

or the place where you require.

This code is for looping over all the form fields and get their values.

Javascript Jquery on one of the multiple input fields changed

2 Answers2