2012-10-03 24 views
0

我創建了一張發票。我在哪裏放3個字段:數量,費率和總金額。按此格式計算的總金額(數量*費率)。所有總金額總和顯示在Sub_total div上。這裏是我的代碼:如何發送php循環數據到jquery

<html> 
    <head> 
     <title>Invoice</title> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript"> 

    $(document).ready(function(){ 

     $(".qty").each(function() { 

      $(this).keyup(function(){ 
       calculateSum(); 
      }); 
     }); 

     $(".rate").each(function() { 

      $(this).keyup(function(){ 
       calculateSum(); 
      }); 
     }); 


    }); 

    function calculateSum() { 

    var qty = 1; 
     $(".qty").each(function() { 

      if(!isNaN(this.value) && this.value.length!=0) { 
       qty = parseFloat(this.value); 
      } 

     }); 

       var rate = 0; 
     $(".rate").each(function() { 
      if(!isNaN(this.value) && this.value.length!=0) { 
       rate = parseFloat(this.value); 
      } 

     }); 

     $('input[name=total_amount]').val(qty.toFixed(2)*rate.toFixed(2)); 
    } 
</script> 
     <style type="text/css"> 
table 
{ 
    border: 1px solid black; 
    border-bottom: none; 
    width: 600px; 
} 


td 
{ 
    border-left: 1px solid black; 
    border-bottom: 1px solid black; 
    padding:5px 5px 5px 5px; 
} 
#first 
{ 
    border-left: none; 
    border-bottom: 1px solid black; 
} 
     </style> 
    </head> 
    <body> 
     <table cellpadding="0" cellspacing="0"> 
      <tr> 
       <td id="first">Quantity</td> 
       <td>Rate</td> 
       <td>Total Amount</td> 
      </tr> 
      <?php 
      $num=4; 
      for ($i=0; $i<$num; $i++) 
      { 
       echo " 
      <tr> 
       <td id='first'><input class='qty' type='text' name='qty[]'/></td> 
       <td><input class='rate' type='text' name='rate[]'/></td> 
       <td><input class='total_amount' type='text' name='total_amount[]'/></td> 
      </tr>"; 
      } 
      ?> 
         <tr> 
          <td id="first" colspan="2" align="right">Sub Total:</td> 
      <td><span id="sub_total">0</span></td> 
      </tr> 
       </table> 

    </body> 
</html> 

我想說明這樣

total_amount[1]=(qty[1]*rate[1]) 
total_amount[2]=(qty[1]*rate[1]) 
total_amount[3]=(qty[1]*rate[1]) 
total_amount[4]=(qty[1]*rate[1]) 

我如此努力,但我的代碼不能正常工作下各總額。所以請請有人幫我解決這個問題。

+1

這不是真的清楚你的要求。 – Ikke

+0

你在問什麼不清楚? –

回答

0
$(document).ready(function(){ 
    $(".qty, .rate").keyup(function(){ 
     calculateSum();    
    }); 
}); 

function calculateSum() { 
    var qty = []; 
    $(".qty").each(function() { 
      var num = parseFloat(this.value) || 1; 
      qty.push(num); 
    }); 

    var rate = []; 
    $(".rate").each(function() { 
      var num = parseFloat(this.value) || 0; 
      rate.push(num); 
    }); 
    var sub_total = 0; 
    $('input[name=total_amount]').each(function(i){ 
     var amount = qty[i].toFixed(2)*rate[i].toFixed(2); 
     total += amount; 
     $(this).val(amount); 
    } 
    $("#sub_total").text(total); 
} 
+0

謝謝穆薩和所有其他人。您的代碼完美工作,但是如何獲得全部總金額 0 user1493448

+0

@ user1493448請參閱更新 – Musa

0

你並不需要分配使用$。每個事件擺在首位..

$('.qty , .rate').keyup(function() { 
    calculateSum($(this).closest('tr')); 
}); 

function calculateSum($tr) { 
    var $qty = $tr.find('.qty').val(); 
    var $rate = $tr.find('.rate').val(); 
    $tr.find('.total_amount').val( parseFloat($qty).toFixed(2)* parseFloat($rate).toFixed(2)) 
} 

這應該是足夠

+0

var $ rate = $ tr.find('。rate')。val(); (我在這一行中得到錯誤信息) – user1493448

+0

在上面的語句中有一個逗號。用分號代替它,它應該是好的 –