如何在jquery中对已检查字段的值求和

时间:2014-06-07 09:30:33

标签: php jquery mysql ajax

我有一个网格,显示来自 MYSQL 数据库的数据 PHP

我也提供了一个复选框,如果用户勾选复选框,则应添加选中的值并显示在底部。

这是php网格:

<form id='myform' method='post' action=''>
<table id='mytable'>
     <?php
       $sql_getData = "SELECT * FROM MYTABLE";
       $result_getData = mysql_query();
       while($arr_data = mysql_fetch_array($sql_getData))
       {
             ?>
                 <tr>
                    <td><?php echo $arr_data['payment_id'] ?></td>
                    <td><?php echo $arr_data['payments'] ?></td>
                    <td><input type='checkbox' name='mycheckbox' class='mycheckbox'></td>
                 <tr>
             <?php
       }
     ?>
     <tr><td>Total Payments</td><td>TOTAL_VALUE</td></tr>
     </table>
</form>

编辑:提供Reigel建议的输出** **预期输出: enter image description here

如何使用jquery

显示TOTAL_VALUE

更新了在循环中添加所有值的代码,因为它不应该......! :

<form id="myform" method="post" action="">
    <table id="mytable">
        <?php
        $sql_getData = "SELECT * FROM MYTABLE";
        $result_getData = mysql_query();
        while($arr_data = mysql_fetch_array($sql_getData)){
            echo '
             <tr>
                <td>'.$arr_data['payment_id'].'</td>
                <td>'.$arr_data['payments'].'</td>
                <td><input type="checkbox" name="mycheckbox" class="mycheckbox" data-payment="'.$arr_data['payments'].'"></td>
             <tr>'
           }
         ?>
         <tr>
            <td>Total Payments</td>
            <td id="tp">0.00</td>
        </tr>
     </table>
</form>

<script>
$(".mycheckbox").change(function(){
    var payment = 0;
    $(".mycheckbox:checked").each(function(){
        payment += parseFloat($(this).attr("data-payment"));
    });
    $("#tp").html("<p>"+payment.toFixed(2)+"</p>");
});
</script>

最终更新的代码,在Andy gee的指导下完美运行:

<form id="myform" method="post" action="">
    <table id="mytable">
        <?php
        $sql_getData = "SELECT * FROM MYTABLE";
        $result_getData = mysql_query();
        while($arr_data = mysql_fetch_array($sql_getData)){
            echo '
             <tr>
                <td>'.$arr_data['payment_id'].'</td>
                <td>'.$arr_data['payments'].'</td>
                <td><input type="checkbox" name="mycheckbox" class="mycheckbox" data-payment="'.$arr_data['payments'].'"></td>
             <tr>'
           }
         ?>
         <tr>
            <td>Total Payments</td>
            <td id="tp">0.00</td>
        </tr>
     </table>
</form>

<script>
$(".mycheckbox").change(function(){
    var payment = 0;
    $(".mycheckbox").each(function(){
        payment += $(this).prop("checked") ? parseFloat($(this).attr("data-payment")) : 0;
    });
    $("#tp").html("<p>"+payment.toFixed(2)+"</p>");
});
</script>

1 个答案:

答案 0 :(得分:2)

如果我理解正确,这应该为您做到 - 假设$arr_data['payments']包含付款金额

<?
$exch_rate = 1.2;
?>


<form id="myform" method="post" action="">
    <table id="mytable">
        <?php
        $sql_getData = "SELECT * FROM MYTABLE";
        $result_getData = mysql_query();
        while($arr_data = mysql_fetch_array($sql_getData)){
            echo '
             <tr>
                <td>'.$arr_data['payment_id'].'</td>
                <td>'.$arr_data['payments'].'</td>
                <td><input type="checkbox" name="mycheckbox" class="mycheckbox" data-payment="'.$arr_data['payments'].'"></td>
             <tr>'
           }
         ?>
         <tr>
            <td>Total Payments</td>
            <td id="tp">0.00</td>
            <td id="anotherid">0.00</td>
        </tr>
     </table>
</form>

<script>
$(".mycheckbox").change(function(){
    var exch_rate = <?=$exch_rate;?>;
    var payment = 0;
    $(".mycheckbox").each(function(){
        payment += $(this).prop("checked") ? parseFloat($(this).attr("data-payment")) : 0;
    });
    $("#tp").html("<p>"+payment.toFixed(2)+"</p>");
    payment *= exch_rate;
    $("#anotherid").html("<p>"+payment.toFixed(2)+"</p>");
});
</script>