Question

这与this thread有关。我根据价格，数量，折扣和税收的选择添加自动计算的订单项。

仅限于税收我将值传递为1_2，即id和税率。因此，对于第一个项目，我得到适当的税收价值，但从第二个开始，无论我选择什么税，它都需要第一个项目的税收值。我不知道自己做错了什么。

这是我的HTML，通过它我可以选择值：

    <td>
        <select name="tax[]" class="form-control tax" id="tax_1" style="width:80px;">
            <option value="">Tax</option>
<?php 
    $s1 = mysqli_query($con, "select * from taxes");
    while($s2 = mysqli_fetch_array($s1)) { 
        $options .= "<option value='". $s2['tax_id']."_".$s2['rate']."'>"
                    .$s2['name'].'-'.$s2['rate'] . "</option>"; 
?>
            <option value="<?php echo $s2['tax_id']."_".$s2['rate']; ?>">
                <?php echo $s2['name'].'-'.$s2['rate']; ?></option>
<?php
    }  
?>
        </select>
    </td>                        
</tr>

我的剧本：

  $(".addmore").on('click', function() {
    count = $('table tr').length - 1;
    var data = "<tr><td><input type='checkbox' class='case'/></td><td><input class='form-control' type='text' id='productname_" + i + "' name='productname[]'/></td><td><input class='form-control' type='text' id='productcode_" + i + "' name='productcode[]'/></td> <td><textarea class='form-control' id='description_"+ i + "' name='description[]'></textarea></td><td><select class='form-control uom' id='uom_" + i + "' name='uom[]'><option value=''>UOM</option>" + options1 + "</select></td><td><input class='form-control price' type='text' id='price_" + i + "' name='price[]'/></td><td><select class='form-control tax' id='tax_" + i + "' name='tax[]'><option value=''>Tax</option>" + options + "</select></select></td><td><input class='form-control quantity' type='text' id='quantity_" + i + "' name='quantity[]'/></td><td><input class='form-control discount' type='text' id='discount_" + i + "' name='discount[]'/></td><td><input class='form-control amount' type='text' id='amount_" + i + "' name='amount[]'/></td><td><input class='form-control tamount' type='text' id='tamount_" + i + "' name='tamount[]'/></td></tr>";
    $('table').append(data);
    row = i;
    $('#productname_' + i).autocomplete({
      source: function(request, response) {
        $.ajax({
          url: 'ajax.php',
          dataType: "json",
          method: 'post',
          data: {
            name_startsWith: request.term,
            type: 'items_table',
            row_num: row
          },
          success: function(data) {
            response($.map(data, function(item) {
              var code = item.split("|");
              return {
                label: code[0],
                value: code[0],
                data: item    
              }
            }));
          }
        });
      },

  $('body').on('change', '.quantity,.price,.discount,.tax', function() {
    var tr = $(this).parent().parent();
    var qty = tr.find('.quantity').val();
    var price = tr.find('.price').val();
    var taxVal= $('.tax').val();
    var tax_id=taxVal.split('_')[0];
    var rate=taxVal.split('_')[1];
  // Here from 2nd line item i am getting 1st line items value for tax. 
    var dis = tr.find('.discount').val();
    var amt = (qty * price) - (qty * price * dis) / 100;
    var tax1 = (amt * (rate / 100));

    tax1 = Number((tax1).toFixed(2));
    tr.find('.tamount').val(tax1);
    ttotal();
    tr.find('.amount').val(amt);
    total();
    //tr.find('.ttotal1').val();
  });

Answer 1

我明白了。这是因为您正在选择.tax选择器，如下所示：

var taxVal= $('.tax').val();

您应该使用$(this)来抓住它。因为你这样做的方式，它总是抓住第一个。

请参阅此jsfiddle以获取示例

简而言之： $('.tax');会在.tax中选择DOM类的任何元素。当您使用任何类型的绑定时，this将是触发绑定的元素（change事件）

因此，通过抓住$(this)，您将抓住实际已更改的元素。通过抓取$('.tax')，您只需抓住.tax中的任何 DOM元素。

希望这会有所帮助：）

示例html

<select class="tax" id="tax">
  <option value="1_2">1_2</option>
  <option value="1_3">1_3</option>
  <option value="2_2">2_2</option>
</select>

<select class="tax" id="tax">
  <option value="3_2">3_2</option>
  <option value="3_3">3_3</option>
  <option value="3_2">3_2</option>
</select>

示例jQuery

$('.tax').on('change', function() {

  var $changedInput = $(this);
  var value = $changedInput.val();
  var aValues = value.split('_');
  var tax_id = aValues[0];
  var rate = aValues[1];

  alert("tax_id: " + tax_id + " Rate:" + rate );
});

P.S。在你自己的代码中，你已经抓住了其他字段的parentrow以便找到它们，那么为什么不为.tax执行此操作？

tr.find('.tax').val();

Answer 2

＆＃34;因此，对于第一个项目，我获得了适当的税收价值，但是来自第二个问题，无论我选择什么样的税，都需要缴纳第一项税。值＆＃34;

我所看到的，你没有采用当前的对象值。你总是引用班级名称。因为，每个输入都有ID（由_分隔）。您可以获取该特定输入字段的ID，并可以拆分以获取它的确切/当前ID。使用此当前ID，您也可以找到其他输入值。

更新代码

$('body').on('change', '.quantity,.price,.discount,.tax', function() {

    var tr = $(this).parents('tr');
    var id_clicked =  $(this).attr('id');
    var current_id = id_clicked.split("_")[1];

    var qty = tr.find("#quantity_"+current_id).val();
    var dis = tr.find("#tax_"+current_id).val();
    var price = tr.find("#price_"+current_id).val();
    var taxVal= tr.find("#tax"+current_id).val();
    var rate = taxVal.split('_')[1];

    var amt = (qty * price) - (qty * price * dis) / 100;
    var tax1 = (amt * (rate / 100));
    tax1 = Number((tax1).toFixed(2));

    tr.find('#tamount_'+current_id).val(tax1);
    tr.find('#tamount_'+current_id).val(amt);
  });

拆分值未正确计算

2 个答案:

示例html

示例jQuery