Question

我正在开发一个网络应用，我必须从动态添加的输入字段中计算总价格。

基本上我搜索数据库中的项目，然后有一个与搜索匹配的项目的下拉列表，当我点击其中一个项目时，它会像下图中的行一样出现。

现在我需要帮助获得所有项目的总价格（数量*价格/单位 - 折扣（如果有的话））每次添加/删除项目或更改其中一个变量时都必须重新计算（数量，价格/单位，折扣）。

以下是一些用于生成输入的代码（我使用laravel 5.0）

<div class="row">
<div class="large 12 columns">
        <div class="large-1 columns">
        <label>Quantity</label>
        {!! Form::text("units[]","1") !!}
    </div>
    <div class="large-1 columns">
        <label>GroupNR</label>
        {!! Form::text("article_group[]",$item->article_group_id) !!}
    </div>
    <div class="large-3 columns">
        <label>Item name</label>
        {!! Form::text("article[]",$item->article) !!}
    </div>
    <div class="large-3 columns">
        <label>Description</label>
        {!! Form::text("description_en[]",$item->description_en) !!}
    </div>
    <div class="large-1 columns">
        <label>Price/Unit</label>
        {!! Form::text("unit_price[]",$item->base_price * $rentalPrice[$days] / 100 + $item->start_price) !!}
    </div>
    <div class="large-1 columns">
        <label>Discount</label>
        {!! Form::text("discount[]","0") !!}
    </div>
    <div class="large-1 columns">
        <label>Invoice</label>
        {!! Form::checkbox("invoice[]",null,["checked"]) !!}
    </div>
    <div class="large-1 columns">
        <label>D. Note</label>
        {!! Form::checkbox("delivery_note[]",null,["checked"]) !!}
    </div>
</div>

对于那些不熟悉Laravel的人来说，这是html输出：

<form id="itemForm">
  <div class="row">
    <div class="large-12 columns">
            <div class="large-1 columns">
            <label>Quantity</label>
            <input name="units[]" type="text" value="1">
        </div>
        <div class="large-1 columns">
            <label>GroupNR</label>
            <input name="article_group[]" type="text" value="2401">
        </div>
        <div class="large-3 columns">
            <label>Item name</label>
            <input name="article[]" type="text" value="Item 1">
        </div>
        <div class="large-3 columns">
            <label>Description</label>
            <input name="description_en[]" type="text" value="Description">
        </div>
        <div class="large-1 columns">
            <label>Price/Unit</label>
            <input name="unit_price[]" type="text" value="7500">
        </div>
        <div class="large-1 columns">
            <label>Discount</label>
            <input name="discount[]" type="text" value="0">
        </div>
        <div class="large-1 columns">
            <label>Invoice</label>
            <input checked="checked" name="invoice[]" type="checkbox">
        </div>
        <div class="large-1 columns">
            <label>D. Note</label>
            <input checked="checked" name="delivery_note[]" type="checkbox">
        </div>
    </div>
</div>
<div class="row">
    <div class="large 12 columns">
            <div class="large-1 columns">
            <label>Quantity</label>
            <input name="units[]" type="text" value="1">
        </div>
        <div class="large-1 columns">
            <label>GroupNR</label>
            <input name="article_group[]" type="text" value="1114">
        </div>
        <div class="large-3 columns">
            <label>Item name</label>
            <input name="article[]" type="text" value="Item 2">
        </div>
        <div class="large-3 columns">
            <label>Description</label>
            <input name="description_en[]" type="text" value="Description">
        </div>
        <div class="large-1 columns">
            <label>Price/Unit</label>
            <input name="unit_price[]" type="text" value="345">
        </div>
        <div class="large-1 columns">
            <label>Discount</label>
            <input name="discount[]" type="text" value="0">
        </div>
        <div class="large-1 columns">
            <label>Invoice</label>
            <input checked="checked" name="invoice[]" type="checkbox">
        </div>
        <div class="large-1 columns">
            <label>D. Note</label>
            <input checked="checked" name="delivery_note[]" type="checkbox">
        </div>
    </div>
</div>
</form>

帮助将不胜感激：）

问候

Answer 1

您可以使用：

$('.row').each(function(){
  var quantity = parseInt( $(this).find('[name="units[]"]').val(),10)
  var price = parseInt( $(this).find('[name="unit_price[]"]').val(),10)
  total += quantity * price;
});

<强> Working Demo

使用jquery从输入值计算总价格

1 个答案: