как изменить значение поля на основе поля количества и поля выбора

Question

Я пытаюсь обновить значение поля на основе опции выбора поля выбора и количества полей с несколькими количествами, оно отлично работает для первого поля, но не будет работать для остальных.

это ссылка на сайт http://www.snappy -pizza.net / pizza1c.php

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

  <input name="update_price" type="text" id="update_price" value="" size="8" maxlength="8" />


  <form>
                <select name="select" id="select">
                  <option>Select your pizza</option>
                  <option value="6.65">NY, 10&quot;, £6.65</option>
                  <option value="8.95">NY, 12&quot;, £8.95</option>
                  <option value="11.95">NY, 16&quot;, £11.95</option>
                  <option value="3.45">Chicago, 7&quot;, £3.45</option>
                  <option value="6.65">Chicago, 10&quot;, £6.65</option>
                  <option value="8.95">Chicago, 12&quot;, £8.95</option>
                  <option value="11.95">Chicago, 16&quot;, £11.95</option>
                  <option value="19.95">Chicago, Beast 24&quot; x 18&quot;, £19.95</option>
                 </select>
         </form>


       <form>
         <tr>
            <td> 

            <span class="descriptionsPizza">EXTRA CHEESE</span>
            <input name="minus1" type="button" class="button minus" id="minus1" value=" - " />
            <input name="textfield1" type="text" id="textfield1" class="valfield" size="2" maxlength="2" value="0" />
            <input name="add1" type="button" class="button add" id="add1" value=" + " />
            </td>

            <td>
            <span class="descriptionsPizza">HAM</span>    
            <input name="minus2" type="button" class="button minus" id="minus2" value=" - " />
            <input class="valfield" name="textfield2" type="text" id="textfield2" size="2" maxlength="2" value="0"/>
            <input name="add2" type="button" class="button add" id="add2" value=" + " />
            </td>
            </tr>




           //function to change the quantity field by pressing the + and - buttons
   $(function()
    {
      topping_price = 1;
      $(".add").click(function(){
     var newQty =+($(this).siblings(".valfield").val()) + 1;
     $(this).siblings(".valfield").val(newQty);

 current_price =+($('input[name=update_price]').val() );
 $('input[name=update_price]').val(topping_price + current_price);
  });

 $(".minus").click(function(){
 var newQty = +($(this).siblings(".valfield").val()) - 1;
 if(newQty < 0)newQty = 0;
 $(this).siblings(".valfield").val(newQty);

var current_price =+($('input[name=update_price]').val() );
$('input[name=update_price]').val(current_price - topping_price);
});

}); * +1011 *

  //function to get the value and text of the selected select box and insert them into hidden fields.
 $(function()
  {
$('#select').change( function() {
    $('input[name=my-item-name]').val( $("#select :selected").text() );
    $('input[name=my-item-price]').val( $("#select").val() );

    $(".add").each(function() {
        //gets the value of the selected box (i.e.price) and insert it into the updated price field.
        var new_qty =+ ($(".add").siblings(".valfield").val() );
        var pizza_price =+ ($("#select :selected").val() );
        $('input[name=update_price]').val((new_qty * topping_price) + pizza_price);
    });
});

});

любая помощь будет оценена ..

Answer 1

Я улучшил ваш файл jquery.js. Эта версия намного чище.

// JavaScript Document

var toppingPrice = 1;

//function to get the value and text of the selected select box and insert them into hidden fields.  
var updateTotalPrice = function() {
  var pizzaPrice = parseFloat($("#select").val());
  var quantity = 0;
  $(".add").each(function() {
    quantity = quantity + parseInt($(this).siblings(".valfield").val(), 10);
  });
  $('#update_price').val((quantity * toppingPrice) + pizzaPrice);
}

$(function()
{
  //functions to change the quantity field by pressing the + and - buttons
  // add buttons
  $(".add").click(function(){
    var $this = $(this);
    var quantity = parseInt($this.siblings(".valfield").val(), 10) + 1;
    $(this).siblings(".valfield").val(quantity);

    updateTotalPrice();
  });

  // minus buttons
  $(".minus").click(function(){
    var $this = $(this);
    var quantity = parseInt($this.siblings(".valfield").val(), 10) - 1;
    if(quantity < 0) quantity = 0;
    $(this).siblings(".valfield").val(quantity);

    updateTotalPrice();
  });

  // selectbox
  $('#select').change(function() {
    updateTotalPrice();
  });

  //function to generate a random number and insert them to the item id hidden field
  $('input[name=my-add-button]').click(function() {
    var randomNumber = Math.floor((Math.random() * 9000) + 100);
    $('input[name=my-item-id]').val(randomNumber);
  });
});

Answer 2

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

$(function() {
  $('#select').change(function() {
    var pizza_price = parseFloat($(this).val());
    var new_qty = 0;
    $(".add").each(function() {
      new_qty = new_qty + parseInt($(this).siblings(".valfield").val(), 10);
    });
    $('#update_price').val((new_qty * topping_price) + pizza_price);
  });
});