Вычислить множественный выбор выпадающего

Question

У меня есть меню множественного выбора, как так:

<select style="width:345px;" multiple="multiple" id="syndicate_group"> 
    <option data-cost="10" value="groupNo114">Starter</option> 
    <option data-cost="15" value="groupNo100">Bronze</option> 
    <option data-cost="25" value="groupNo104">Silver</option> 
    <option data-cost="34" value="groupNo108">Gold</option> 
    <option data-cost="0" value="groupNo115">Other</option> 
</select> 

<input type="number" placeholder="" value="" name="ammountToPay" id="ammountToPayField"> 

Я хочу сделать расчет на основе данных цены и не значение выбора пользователя, поэтому, если пользователь выбирает как стартер, так и бронза, значение в id «ammountToPayField» будет 25, но тогда, если они решат, что они хотят только бронзы, значение в «ammountToPayField» будет только 15, но в течение некоторого времени я мог только найдите поля ввода, а не поле множественного выбора.

Answer 1

Попробуйте это:

$('#syndicate_group').change(function() { 
    var sum = $(this).find(':checked') 
        .map(function() { return parseInt($(this).data('cost'), 10); }) 
        .get() 
        .reduce(function(x, y) { return x + y; }); 

    $('#ammountToPayField').val(sum); 
}); 

См Fiddle

Answer 2

Попробуйте это:

$("#syndicate_group").change(function() { 
var sum = 0; 
$("select option:selected").each(function() { 
    sum += parseInt($(this).text()); 
}); 
$("#ammountToPayField").text(sum); }).change();