php - 多行自动计算和复选框？如何减少呢？-6ren

php - 多行自动计算和复选框？如何减少呢？

转载作者：行者123 更新时间：2023-11-27 22:44:13

What will I add if everytime user is unchecking the checkbox, the ammount will be reduced ? Thanks

我有下面的代码:

echo '<INPUT TYPE="text" NAME="eg_payamt_[]" Value="' . $amount_dueArr[$record_count] . '" size="10"><br>';//display ammountDue (AmmountDue)                   

echo '<INPUT TYPE="text" NAME="eg_payamt_[]" Value="' . $TotalArr[$record_count] . '" size="10"><br>';//display outstanding (Total)

<td><input type="checkbox" name="pay[]" value="" /></td>

enter image description here

我的问题是，每次用户单击复选框时，如何计算文本框内的总金额？

谢谢

你可以这样做吗:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<table>
<tr>
<td><INPUT TYPE="text" NAME="eg_payamt_[]" Value="" size="10"><td><br>
<td><input type="checkbox" name="pay[]" value="" onclick="return calculateSum();" /></td>
</tr>
<tr>
<td><INPUT TYPE="text" NAME="eg_payamt_[]" Value="" size="10"><td><br>
<td><input type="checkbox" name="pay[]" value="" onclick="return calculateSum();" /></td>
<tr>
<td><INPUT TYPE="text" NAME="answer" id="answer" Value="" size="10"><td><br>
</tr>
</table>


<script>
    function calculateSum() {

        var sum = 0;
        //iterate through each textboxes and add the values
       //$("input:text").each(function() {
       $("input[type='text'][name='eg_payamt_[]']").each(function(){ 

            //add only if the value is number
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            }

        });

        //.toFixed() method will roundoff the final sum to 2 decimal places
        $("#answer").val(sum.toFixed(2));
    }
</script>

你能做到吗？它在工作吗？我现在正在尝试...

完整代码:

<head>
<script type="text/javascript" src="jquery-1.7.1.js">
</script>
</head>
<script>
                                    function calculateSum() {

                                        var sum = 0;
                                        //iterate through each textboxes and add the values
                                        //$("input:textbox").each(function() {
                                        //$("input:eg_payamt_[]").each(function() { 
                                        $("input[type='text'][name='eg_payamt_[]']").each(function(){       


                                            //add only if the value is number
                                            if(!isNaN(this.value) && this.value.length!=0) {
                                                sum += parseFloat(this.value);
                                            }

                                        });
                                        //.toFixed() method will roundoff the final sum to 2 decimal places
                                        $("#answer").html(sum.toFixed(2));
                                    }
                                    </script>


     <form name="payform" method="POST" action="payment.php">
    <H2>Pay Invoices</H2>

        <table border="0"><!--begin of the table-->
            <tr>
               <td><b>Date</b></td>
               <td><b>Invoice</b></td>
               <td><b>Ammount</b></td>
               <td><b>Outstanding</b></td>
               <td><b>Pay</b></td>
            </tr>
            <tr>
                <td width="512px" colspan="5"><IMG SRC="rule-black.gif" WIDTH="800" HEIGHT="11"><br></td>
            </tr>

            <?php
                  echo '<INPUT TYPE="hidden" NAME="record" Value="'.$record.'">';
              $amountDueTotal = 0;
           for($record_count=0;$record_count<$record;$record_count++)
                { //loop for record count
                        ?>


            <tr>

               <td> 
                    <?php
                        $strDate = $node_date->nodeValue; //display the date of invoice (Date)
                        echo substr($strDate, -2) . '-' . substr($strDate, -4, 2) . '-' . substr($strDate, 0, 4);
                        //echo $node_date->nodeValue; //display the date of invoice (Date)
                    ?>
               </td>

               <td>
                   <?php
                       //echo $node_inv_no->nodeValue; //display the invoice number (DocumentID)
                       echo '<INPUT TYPE="text" NAME="eg_description_[]" Value="' . $invoiceArr[$record_count] . '" size="20"><br>';  //display the invoice number (DocumentID)
                    ?>   
               </td>

               <td>
                    <?php
                       echo '<INPUT TYPE="text" NAME="eg_payamt_[]" Value="' . $amount_dueArr[$record_count] . '" size="10"><br>';//display ammountDue (AmmountDue)                   
                       //echo $node_amount_due->nodeValue; //display ammountDue (AmmountDue)
                    ?>   
               </td>

               <td>
                    <?php
                       echo '<INPUT TYPE="text" NAME="eg_payamt_[]" Value="' . $TotalArr[$record_count] . '" size="10"><br>';//display outstanding (Total)                   
                       //echo $node_total->nodeValue; //display outstanding (Total)
                    ?>   
               </td>
               <td><input type="checkbox" name="pay[]" value="" onClick="calculateSum()"/></td>
            </tr>
            <tr>
               <td></td>

               <?php
                     $amountDueTotal += $amount_dueArr[$record_count]; //calculate the total ammount due
                       //Hidden fields
                      echo '<INPUT TYPE="hidden" NAME="eg_invoice_[]" Value="'.$invoiceNoArr[$record_count].'">';
                      echo '<INPUT TYPE="hidden" NAME="p_invage_[]" Value="'.$DateArr[$record_count].'">';
                }//end of the record count loop 

                ?>
            <tr>
               <td>Pay Ammount Not Listed Above</td>
               <td><input type="text" name="UnknownDocumentID" value="Invoice_unknown_docID_data" /></td>
               <!--<td><input type="text" name="Amount_Due_Unknown_Doc_ID" value="amount" size="10"/></td>--><!--Amount Due-->
               <td><input type="text" name="eg_payamt_[]" value="amount" size="10"/></td><!--Total-->
               <td></td>
               <td><input type="checkbox" name="pay[]" value="" onClick="calculateSum()"/></td>
            </tr>

                     <tr>
                        <td width="512px" colspan="5"><IMG SRC="rule-black.gif" WIDTH="800" HEIGHT="11"><br></td>
                     </tr>



               <td>Total ammount to pay</td>
               <td></td>
               <td></td>

                <td>
                    <!--<input type="text" name="total" value="<?php //echo $amountDueTotal;?>" />-->
                    <input type="text" name="totalNS" id="answer" value="" />
                    <INPUT TYPE="text" NAME="answer" id="answer" Value="" size="10"><br>

                </td>
             </tr>

点击后付款，无结果: Payment after clicking checkbox

我写的代码正确吗？

<INPUT TYPE="text" name="answer" id="answer" Value="" size="10">

因为当我放

document.write(sum);

****得到答案:****

<script type="text/javascript">
    function checkTotal() {
        document.listForm.total.value = '';
        var sum = 0;
        for (i=0;i<document.listForm.choice.length;i++) {
          if (document.listForm.choice[i].checked) {
            sum = sum + parseInt(document.listForm.choice[i].value);
          }
        }
        document.listForm.total.value = sum;
    }
</script>

<form name="listForm">
<input type="checkbox" name="choice" value="2" onchange="checkTotal()"/>2<br/>
<input type="checkbox" name="choice" value="5" onchange="checkTotal()"/>5<br/>
<input type="checkbox" name="choice" value="10" onchange="checkTotal()"/>10<br/>
<input type="checkbox" name="choice" value="20" onchange="checkTotal()"/>20<br/>
Total: <input type="text" size="2" name="total" value="0"/>
</form>

最佳答案

让我们研究一下下面的代码..

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<INPUT TYPE="text" NAME="eg_payamt_[]" Value="" size="10"><br>

<INPUT TYPE="text" NAME="eg_payamt_[]" Value="" size="10"><br>

<INPUT TYPE="text" NAME="answer" id="answer" Value="" size="10"><br>

<td><input type="checkbox" name="pay[]" value="" onclick="return calculateSum();" /></td>
<script>
    function calculateSum() {

        var sum = 0;
        //iterate through each textboxes and add the values
       //$("input:text").each(function() {
       $("input[type='text'][name='eg_payamt_[]']").each(function(){ 

            //add only if the value is number
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            }

        });

        //.toFixed() method will roundoff the final sum to 2 decimal places
        $("#answer").val(sum.toFixed(2));
    }
</script>