Simultaneous inclusion of two different selectors

Question

I am using jQuery to calculate some totals, and I ran into a problem.

Say I have two sets of inputs, each with a unique name.

$('[name="quantity\\[\\]"]')
$('[name="price\\[\\]"]')

I want to loop through each set of inputs at the same time so that I can check for both (! IsNaN) and (length! == 0), and if the values ​​are valid, I want to multiply them and add them to the current amount.

I know that I can cycle through one selector using each (), but how can I cycle through two simultaneously? is there an elegant way to achieve this?

Answer 1

var prices = $('[name="price\\[\\]"]');
$('[name="quantity\\[\\]"]').each(function(i){
  var quantity = this;
  var price    = prices[i];
  // Compare them here.
});

Answer 2

jQuery , "zip".

a b (, , ). fn, . , jQuery .

function zip (a, b, fn) {
   var len = Math.max(a.length, b.length)
   var result = []
   if (fn) {
     for (var i = 0; i < len; i++) {
       result.push(fn(a[i], b[i]))
     }
   } else {
     for (var i = 0; i < len; i++) {
       result.push([a[i], b[i]])
     }
   }
   return result
}

:

var z = zip([1,2,3], ['a','b'])
// z = [[1,'a'],[2,'b'],[3,undefined]
for (var i = 0; i < z.length; i++) {
    var elm = z[i]
    var a = elm[0]
    var b = elm[1]
    alert(a + "-" + b)
}

fn:

zip([1,2,3], ['a','b'], function (a, b) {
    alert(a + "-" + b)
})

jQuery'ish:

var total = 0
zip(
  $('[name="quantity\\[\\]"]'),
  $('[name="price\\[\\]"]'),
  function (a, b) {
    // if either a or b are undefined, there is already a problem
    // the `expr || 0` is to silently handle cases of `NaN || 0` which may
    // result if the price or quantity are garbage values
    var qty = parseInt($(a).val(), 10) || 0
    var price = parseInt($(b).val(), 10) || 0
    total += qty * price
  })

.

Answer 3

var quantities = $('[name="quantity\\[\\]"]'),
    prices = $('[name="price\\[\\]"]');


var len = Math.max(quantities.size(), prices.size());
for (var i=0; i < len; i++) {
  var quantity = quantities.get(i);
  var price = prices.get(i);
  // Do whatever you want with quantity and price    
}

Answer 4

index each .

var quan = $('[name="quantity\\[\\]"]');
var price = $('[name="price\\[\\]"]');
var total = 0;

quan.each(function( index ) {
    var quan_val = +$(this).val();
    var price_val = +price.eq( index ).val();

    if( quan_val && price_val ) {
        total += (quan_val * price_val);
    }
});

alert( total );

Answer 5

:

function getValue() { return this.value; }

var valsA = $('input[name="quantity\\[\\]"]').map(getValue).get(),
    valsB = $('input[name="price\\[\\]"]').map(getValue).get();

for ( var i = 0; i < valsA.length; i++ ) {
    // work with valsA[i] and valsB[i] here
}

Answer 6

:

$('[name="quantity\\[\\]"], [name="price\\[\\]"]')

Answer 7

var quantity = $('[name="quantity\\[\\]"]')
$('[name="price\\[\\]"]').each( function(ind){
    var currentPrice = $(this);
    var currentQuantity = quantity.eq(ind);
});

-

$('[name="price\\[\\]"]').each( function(ind){
    var currentPrice = $(this);
    var currentQuantity = currentPrice.closest('[name="quantity\\[\\]"]');
});