Еогеасп вход многомерный массив

Question

У меня есть следующий HTML

<input type="checkbox" name="array[0][count]" value="1"/> 
<input type="hidden" data-price="50" name="array[0][id]" value="1"/> 

<input type="checkbox" name="array[1][count]" value="5"/> 
<input type="hidden" data-price="20" name="array[1][id]" value="2"/> 

..... 

Я хочу, чтобы вычислить сумму data-price с помощью JQuery с формулой

foreach extra { 
    price += extra[id][data-price] * extra[count] 
} 

//not actual code, just a representation of the result needed 

До сих пор я был в состоянии собрать все входы, используя

$('input[name^="array"]').each(function() { 
    console.log($(this)); 
}); 

Но я не знаю, как продолжить дальше. Любая помощь оценивается. Если вы можете указать мне лучший способ структурирования массива html, я в порядке с этим.

Answer 1

Вы очень близки. Все, что вам нужно сделать, это получить цену от атрибута сейчас.

$(this).attr("data-price"); 

я заметил, не все 'input[name^="array"]' имеют атрибут данных, так что вы должны проверить, если он существует, прежде чем добавлять или просто переименовать те, с фактическим атрибутом данных.

Ниже код работает отлично

$('input[name^="array"]').each(function() { 

var dPrice =$(this).attr("data-price"); 
if(dPrice){ //check if data-price exists for the input 
    price+= parseInt($(this).attr("data-price"),10); 
    } 
}); 

Here's a working fiddle

После того, как у вас есть атрибут, применить формулу и вуаля! Вы сделали

UPDATE от комментариев:

При создании флажок из массива, вы делаете что-то вроде

<input type="hidden" data-price="50" name="array[0][id]" data-quantity=[count] value="1"/> 

, а затем использовать код выше и получить атрибут data-quantity и использовать его в вашей формуле

Answer 2

Один из способов сделать это - это случайные мелочи.

Frist в HTML присоединиться к входной флажок с скрытого поля:

<input type="checkbox" name="array[]" data-price="50" value="1"/> 

<input type="checkbox" name="array[]" data-price="20" value="5"/> 

односторонний, пусть JS, как это:

var total = 0; 
$('input[name^="array"]').each(function() { 
    if($(this)[0].checked){ 
     total += $(this).attr("data-price") * $(this).attr("value"); 
    } 
}); 

Если вы не хотите, чтобы проверить с Флажки checked удалил if.

Если общее становится строкой так что используйте ParseInt

See in Fiddle working

Если вы хотите сохранить HTML как ваша

только изменить одну вещь поставить позицию в атрибуте.HTML ::

<input type="checkbox" name="array2[count]" data-pos="0" value="1"/> 
<input type="hidden" data-price="50" name="array2[id][0]" value="1"/> 

<input type="checkbox" name="array2[count]" data-pos="1" value="5"/> 
<input type="hidden" data-price="20" name="array2[id][1]" value="2"/> 

В JS Виль быть такими:

var total2 = 0; 

    $('input[name^="array2[count]"]').each(function() { 
    if($(this)[0].checked){ 
     var pos = $(this).attr("data-pos"); 
     total2 += $('input[name^="array2[id]['+pos+']"]').attr("data-price") * $(this).attr("value"); 
    } 

});

Оба кода находятся в одной и той же скрипку Тест 1 является Фрист пример и тест 2 этот пример

See in Fiddle working