Question

我有一个html表，我使用PHP从数据库中检索数据。该表非常简单，我有三个字段：Quantity，Price和Subtot。在表格的最后，我有一个额外的字段(SumOfAllItems(Quantity*Price))，显示最终费用Subtot。

我需要能够更改＆＃34;数量＆＃34;每行中的值和＆＃34; Quantity＆＃34;应该相应更新。我还需要能够设置用户可用于更新单元格的最小/最大值。

我正在考虑通过＆＃34; <table> <tbody> <tr> <th>Name</th> <th>Quantity</th> <th>Price<th> </tr> <?php while($row2 = $result->fetch_assoc()) {?> <tr> <td><?php echo $row2["Name"] ?></td> <td><?php echo $row2["Quantity"] ?></td> <td><?php echo $row2["Price"]?></td> </tr> <?php $subtot = $subtot + ($row2["Price"] * $row2["Quantity"]) } ?> <td></td> <td><b>Subtot.</b></td> <td><b><?php echo $subtot2 ." Euro"; $tot = $subtot1 + $subtot2;?> </b></td> </tbody> </table>＆＃34;添加类似按钮或任何类型的列表/输入的内容。每行的价值。

我想我需要使用javascript，但我不确定，欢迎提出任何建议。按照我的代码。

谢谢

MATCH (p:Parent)<-[A1:IS_PARENT]-(s:Student)<-[A2:IS_GUARDIAN]-(g:Guardian)
RETURN p,s,g,A1,A2
limit 25;

Answer 1

以下内容应该可行，但我不推荐这种方法（任何方法顺便说一句），而不在服务器端进行任何验证。

你需要在你的php文件之上：

<?php
    $total = 0;

然后你的表就像：

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Quantity</th>
            <th>Price<th>
        </tr>
    </thead>
    <tbody>
        <?php while($row2 = $result->fetch_assoc()) { ?>
        <tr>
            <td><?php echo $row2['name'] ?></td>
            <td><input class="row" min="0" onchange="myFunction()" data-price="<?php echo $row2['price'] ?>" type="number" value="<?php echo $row2['quantity'] ?>"/></td>
            <td><?php echo $row2['price'] ?></td>
        </tr>
        <?php
                $total += $row2['price'] * $row2['quantity'];
            } 
        ?>
        <td></td>
       <td>
            <b>Subtot.</b>
        </td>
        <td>
            <b id="total"><?php echo $total; ?></b>
        </td>
    </tbody>
</table>

您需要以下脚本标记：

<script>
    function myFunction(){
        var total = 0;
        var elements = document.getElementsByClassName("row");
        for(var i = 0; i < elements.length; i++) {
            total += elements[i].value * elements[i].dataset.price;
        }

        var totalEl = document.getElementById("total");
        totalEl.innerHTML = total;
    }
</script>

再说一次......这是一个非常简单的解决方案，但它应该有效。

动态更改html表中的值

1 个答案: