0

こんにちは、ボタンのクリックでテーブル行を動的に追加するフォームがありますが、列名 prevqty、thisqty、qty (合計 qty)、rate および amount があるように、テーブルの列に計算を実行したいと思います。金額の合計が格納される合計フィールド 計算を試みましたが、機能しないようです

ここに私のスクリプトがあります

   $(document).ready(function() {
var currentItem = $('#items').val();

$('#data').on('keyup', '.prevqty, .thisqty, .qty, .rate, .cal', calculateRow);

$('#addnew').click(function() {
    currentItem++;
    $('#items').val(currentItem);
    $('#data').append('<tr>\n\
        <td align="center"><input type="text" size="6" maxlength="6" maxlength="6" name="ord_' + currentItem + '" class="form-input-oth" onkeyup="return copy(this.val());"/></td>\n\
            <td align="center"><input type="text" size="6" maxlength="6" maxlength="6" name="srno_' + currentItem + '" class="form-input-oth"/></td>\n\
        <td align="center"><textarea name="descrip_' + currentItem + '" cols="70" class="form-input-textareasm"></textarea></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="unit_' + currentItem + '" class="form-input-rate"/></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="prevqty_' + currentItem + '" class="prevqty form-input-rate" onkeyup="calculateRow();"//></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="thisqty_' + currentItem + '" class="thisqty form-input-rate" onkeyup="calculateRow();"//></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="qty_' + currentItem + '" class="qty form-input-rate" onkeyup="calculateRow();"/></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="rate_' + currentItem + '" class="rate form-input-rate" onkeyup="calculateRow();"/></td>\n\
            <td align="center"><input type="text" size="6" maxlength="9" maxlength="6" name="amt_' + currentItem + '" class="cal  form-input-amt" onkeyup="calculateRow();"/></td>\n\
        </tr>'
                     );
});

function calculateSum() {
    var sum = 0;
    $(".cal").each(function () {
        if (!isNaN(this.value) && this.value.length != 0) {
            sum += parseFloat(this.value);
        }
    });
    $("#total").val(sum.toFixed(2));
}
function calculateRow() {
    var cost = 0;
    var $row = $(this).closest("tr");
    var prevqty = parseFloat($row.find('.prevqty').val());
    var thisqty = parseFloat($row.find('.thisqty').val());
    var qty = parseFloat($row.find('.qty').val(prevqty + thisqty));
        //parseFloat($row.find('.qty').val());
    alert(qty);
    if (isNaN(qty)) {
        $row.find('.qty').val("0");
    } else {
        $row.find('.qty').val(qty);
    }
    // changed the following line to only look within the current row
    var rate = parseFloat($row.find('.rate').val());

    cost = qty * rate;

    if (isNaN(cost)) {
        $row.find('.cal').val("0");
    } else {
        $row.find('.cal').val(cost);
    }
    calculateSum();
}});

私はここで作業中のフィドルを持っています prevqty と thisqty は適切に機能していますが、レートと金額の計算は機能していませんhttp://jsfiddle.net/rey_kahn/YS4N2/を参照してください

4

2 に答える 2

0

先頭に Default Row と Grand Total を追加。

そして、いくつかの小さな変更。

<table border="1px" width="90%" id="data">                  
              <tr>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Order</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Sr No.</font><span></span></label></td>
                 <td width="580px" align="center"><label for=""><font color="#0099FF" size="3px">Description</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Unit</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Previous Qty.</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">This Bill Qty</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Total Quantity</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Rate</font><span></span></label></td>
                 <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Amount</font><span></span></label></td>
              </tr>
               <tr>
                <td><input type="text" size="6" maxlength="6" maxlength="6" name="ord_' + currentItem + '" class="form-input-oth" onkeyup="return copy(this.val());"/></td>
                <td><input type="text" size="6" maxlength="6" maxlength="6" name="srno_' + currentItem + '" class="form-input-oth"/></td>     
                <td><textarea name="descrip_' + currentItem + '" cols="70" class="form-input-textareasm"></textarea></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="unit_' + currentItem + '" class="form-input-rate"/></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="prevqty_' + currentItem + '" class="prevqty "/></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="thisqty_' + currentItem + '" class="thisqty "/></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="qty_' + currentItem + '" class="qty "/></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="rate_' + currentItem + '" class="rate "/></td>     
                <td><input type="text" size="6" maxlength="9" maxlength="6" name="amt_' + currentItem + '" class="cal"/></td>     
              </tr>
              <tr>
                <td colspan="8"></td>
                <td><input type="text" id="total"/></td>
              </tr>


更新されたリンクを確認してください: http://jsfiddle.net/YS4N2/9/

于 2016-04-27T09:26:34.947 に答える