jquery - 如何使用jquery从销售表单中的附加行计算总金额

Question

在下面的模态图像中，如何进行 jquery 计算以从每个附加行中获取总金额值？工作过程是当我选择食物项目（onchange 事件）时，ajax 调用将当前速率返回到 textbox-1。当我输入数字数量（keyup 事件）时，它会计算 qty*rate 并在 textbox-2 中显示值。当我单击加号按钮时，它会在新行中添加选择和数量输入。在这里，我使用 id 名称进行计算。下面是计算代码：

$(document).on('keyup', '#entrysalesqty', function() {  
        
        var t=0;
       var a = $("#ratexqty").val($(this).val() * $("#getrate").val());
      if(isNaN(a)){
        
      }else{
       t = a + t;
      }
      $("#totalamount").val(t);
      });

下面是html代码

<!--Add sales Modal -->
              <div class="modal fade" id="addTakeOrderModal" tabindex="-1" role="dialog" aria-labelledby="modelTitleId" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered" role="document">
                  <div class="modal-content">
                    <div class="modal-header">
                      <h5 class="modal-title">Take Food Order</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <form method="POST" id="add-takeorder-form-data">
                      <div class="modal-body px-4">
                          <div class="form-group">
                            <input type="text" name="entrysalesdate" id="entrysalesdate" class="form-control cursormove13" required autocomplete="off">
                          </div>
                          <div class="form-group">
                            <input type="text" name="entrysalesbill" id="entrysalesbill" class="form-control cursormove13" required autocomplete="off">
                          </div>
                          <div class="form-group">
                            <table id="ordertable" class="ordertable">
                              <tbody>
                                <tr>
                                <th>
                                <select class="form-control cursormove13 entrysalesfi" name="entrysalesfi[]" id="entrysalesfi" required style="width: 100%;">
                                  <option selected>Select food item</option>
                                  <?php 
                                    include_once "actionentries.php";
                                    echo $db2->getFoodList();
                                  ?>
                                </select>
                                </th>
                                <th><input type="text" name="entrysalesqty[]" id="entrysalesqty" class="form-control cursormove13" placeholder="Quantity**" required autocomplete="off"></th>
                                <th><button type="button" name="addrow" class="btn btn-success addrow cursormove13" id="addrow"><i class="fa fa-plus"></i></button></th>
                                </tr>
                              </tbody>
                            </table>
                          </div>
                          <div class="form-group">
                          <input class="form-control getrate" name="getrate" id="getrate" type="text">
                          <input class="form-control ratexqty" name="ratexqty" id="ratexqty" type="text">
                          </div>
                          <div class="form-group" id="showRate">
                            <div class="input-group">
                              <div class="input-group-prepend">
                              <span class="input-group-text">Total Amount to pay in MYR</span>
                              </div>                      
                                <input class="form-control" name="totalamount" id="totalamount" type="text" value="" readonly>
                            </div>
                          </div>                         
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <input type="submit" name="entrysalesinsert" id="entrysalesinsert" value="Save" class="btn btn-danger cursormove13">
                      </div>
                    </form>
                  </div>
                </div>
              </div><!-- /.Add sales Modal -->

请解决这个问题提前谢谢。

标签： jquery

Answer 1

function calculateSum(){
      var sum = 0;
      $('.ratexqty').each(function() {
        if (!isNaN(this.value) && this.value.length != 0) {
        sum += parseFloat(this.value);
      }   
      });
        $('#totalamount').val(sum.toFixed(2));             
      }

使用上述方法解决此问题