无法在HTML中更改表格中输入字段的值

时间:2017-04-06 06:19:26

标签: javascript html

我正在创建一个用于开票的html页面,其中我创建了一个包含以下列的表:序列号,类别名称,产品名称,数量,单价和金额。这里金额=数量*单价

单价仅从mysql db获取。当用户更改产品的数量时,使用javascript中的onkeyup功能将金额更改为数量*单价。这很好。

但是,我保留了一个字段名称Total Amount,它位于表格之外,但在HTML文档中具有唯一ID,它是Amount列中所有值的总和。在Quantity上的相同onkeyup函数中,我想更新总金额。我试着这样做(尽管不是现在的总和,而只是相应行中的Amount值),这是行不通的: -

   <!-- TABLE starts here -->
    <table id="my_table_id" name="billitems">
        <tr>
            <td>Sr. No.</td>
            <td>Category</td>
            <td>Product</td>
            <td>Quantity</td>
            <td>Unit Price</td>
            <td>Amount</td>
        </tr>

        <tr class="clone_this">
            <td>1.</td>
            <td>
            <select style="width:150px;" class="gr" name="categories[]">
                <option value="Select Category">Select Category</option>        
                <?php 
                    include 'connect_my_sql_db.php';
                    $qry = "SELECT cat_id, cat_name FROM category;";
                    $res = mysqli_query($conn, $qry);
                    while($data = mysqli_fetch_row($res)){
                    echo ("<option value='$data[1]'>$data[1]</option>");
                }
                ?></td>
            <td class="sub_item"><select style="width:150px;" class="it_id" name="products[]">
                <option value="Select Product">Select Product</option>
            </td>
            <td><input class="qty" type="number" step="0.01" placeholder="ex: 12.50" name="qty[]" value="0.00" required onkeyup="updatePrice(this.value)"></td>
            <td><input class="unit_price" type="number" step="0.01" placeholder="ex: 56.50" name="unitprice[]" value="0.00" required onkeyup="updatePrice(this.value)"></td>
            <td><input class="pricecalc" type="number" step="0.01" placeholder="will be calculated" name="calculatedprice[]" value="0.00" required readonly="readonly"></td>
        </tr>


    </table>
    <input type="button" value="Add more items" id="more_items" style="margin-top:10px; margin-bottom:20px"/><br>

    <span class="sameline">
            <label class="smalllabel" style="width:100px;">Total Amount</label>
            <input class="total_amount" id="total_amount "type="number" step="0.01" placeholder="will be calculated" name="total_amount" value="0.00" required readonly="readonly"></td>
    </span><br><br>

,总输入的表格和字段为: -

{{1}}

1 个答案:

答案 0 :(得分:0)

您可以使用:

 $(this).closest('tr').find('.pricecalc')[0].value = amount;

而不是:

 $(this).closest('tr').find('.pricecalc').attr("value", amount);