2013-04-17 60 views
1

您好我有一個表格,它可以動態地從外部php文件添加表格行,當用戶點擊添加按鈕到目前爲止一切正常,但我有字段names'Qty」,這將在數字輸入,並應計算出總的是我創建了一個計算功能,但其僅在第一行的工作可以在它應該如何在這裏完成 任何人的幫助是我的腳本如何使用jquery在動態添加的表格行上創建計算

$(document).ready(function(){ 
       $('#detail').on('keyup', '.qty', calculateRow()); 
       $('#addnew').click(function(){ 

        var ctr = $('#items').val(); 
        ctr++; 

        $.post('job_srch.php', {ctr : ctr}, function(data) { 
          $(data).appendTo('#detail'); 

          $('#items').val(ctr);       
        }); 
       }); 

function calculateSum() { 

    var sum = 0; 
    //iterate through each textboxes and add the values 
    $(".qty").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 
    $("#total").val(sum.toFixed(2)); 
} 

function calculateRow() { 
    $('.qty').keyup(function() { 
     //alert("entered"); 
     var $row = $(this).closest("tr"); 
     var qty = parseFloat($row.find('.qty').val()); 

     calculateSum(); 
    }); 
} 
    }); 

這是我的php

session_start(); 
require("includes/dbconnect.php"); 
include ('includes/function.php'); 

$zdb = $_SESSION["zdbyear"]; 
mysql_select_db($zdb); 

if ($_REQUEST["ctr"]){ 
    $ctr = $_REQUEST["ctr"]; 
    //echo '<link rel="stylesheet" href="css/chosen.css" />'; 
echo '<tr> 

    <td align="center"><input type="text" size="6" maxlength="6" maxlength="6" name="srno_'.$ctr.'" class="form-input-oth"/></td> 
    <td align="center"><select data-placeholder="Party" style="width:300px;" name="item_'.$ctr.'" class="chzn-select-deselect" > 
            <option value=""></option>'; 
         $res = mysql_query("SELECT * FROM `items`") or die(mysql_error()); 
         while ($row = mysql_fetch_array($res)) { 
          echo "<option value='$row[accode]'>$row[name]</option>"; 
         } 
    echo '</select></td>'; 
    echo '<td align="center"><input type="text" id="qty" size="6" maxlength="9" maxlength="6" name="qty_'.$ctr.'" class="qty form-input-amt"/></td> 

         </tr>'; 
} 
else{ 
    echo "ERROR"; 
} 

這裏是我的html

  <table id="detail" border="1px" width="80%"> 
      <tr> 
      <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Sr No.</font><span></span></label></td> 
      <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">item</font><span></span></label></td> 
      <td width="130px" align="center"><label for=""><font color="#0099FF" size="3px">Quantity</font><span></span></label></td> 
      </tr> 

       <tr> 
        <td align="center"><input type="text" size="6" maxlength="6" maxlength="6" name="ord_0" class="form-input-oth"/></td> 
        <td align="center"><select data-placeholder="Party" style="width:300px; text-align: left;" name="item_0" class="chzn-select-deselect" > 
          <option value=""></option> 
          <?php 
           $iqry = mysql_query("SELECT * FROM `items` ") or die(mysql_error()); 
            while($trow= mysql_fetch_array($iqry)){ 
             echo "<option value=$trow[accode]>$trow[name]</option>"; 
            } 
          ?> 
         </select></td> 
        <td align="center"><input id="qty" type="text" size="6" maxlength="9" maxlength="6" name="qty_0" class="qty form-input-amt" onkeyup="return calculateSum(); "/></td> 
       </tr> 
<input type="button" id="addnew" class="classname" name="addnew" value="+" /> 
          <input type="text" id="items" name="items" value=" 0" /> 
+0

我認爲你應該使用'.live'這一點。 – ncm

+0

是我做了,它的工作,但可以幫助我與我的第一個問題因爲在javascript中創建的變量doesnt似乎工作 – user2274075

+0

好的問題我的意思是calcRow工作時,你做任何'.qty'的關鍵?你想計算每行的總和? – ncm

回答

0

變化$('#detail').on('keyup', '.qty', calculateRow());as

$(document).on('keyup', '.qty', function(){ 
calculateRow(); // or code here 
});