我刚开始使用jQuery,所以我还是一个新手。有人可以帮我如何在动态表格中计算新价格。我有一个包含3列,数量,折扣和价格的动态表。在用户在当前价格所在的同一文本框中输入折扣(%),小计和总计之后,我需要重新计算新价格。
这是我的桌子:
<table class="table">
<thead><tr><th style="width:60%">Description</th><th class="centrer" style="width:10%">Qty</th><th class="centrer" style="width:10%">Discount</th><th class="centrer" style="width:20%">Price</th></tr></thead>
<tbody>
<?php
if(isset($listeArticlePourUnDossier) && count($listeArticlePourUnDossier) > 0)
{
$sousTotal = 0;
$symbol = '';
$VAT = 0;
$TTC = 0;
$iArticles = 0;
while($iArticles < count($listeArticlePourUnDossier))
{
$ARTICLE_CURRENCY = $listeArticlePourUnDossier[$iArticles]['ARTICLE_CURRENCY'];
$sousTotal = $sousTotal + ($listeArticlePourUnDossier[$iArticles]['ARTICLE_PRIX']);
?>
<tr>
<td><?php echo ($listeArticlePourUnDossier[$iArticles]['ARTICLE_NOM']); ?></td>
<td class="centrer">1</td>
<td class="centrer"><input type="text" name="txtdiscount" id="txtdiscount_<?php echo $iArticles; ?>" onkeyup="calc()"/></td>
<td class="centrer"><input type="text" name="txtPrice" id="txtPrice_<?php echo $iArticles; ?>" readonly value="<?php echo (number_format($listeArticlePourUnDossier[$iArticles]['ARTICLE_PRIX'],2)); ?>"/></td>
</tr>
<?php
$iArticles++;
}
?>
<tr>
<td class="nocolor"></td>
<td></td>
<td class="centrer bold">Subtotal</td>
<td class="centrer bold"><?php echo (number_format($sousTotal,2)); ?></td>
</tr>
<tr>
<td class="nocolor"></td>
<td></td>
<td class="centrer bold">VAT</td>
<td class="centrer"><?phpecho (number_format($VAT,2)); ?></td>
</tr>
<tr>
<td class="nocolor"></td>
<td></td>
<td class="centrer bold">G.Total</td>
<td class="centrer bold">
<?php
$TTC = $sousTotal - $VAT;
echo (number_format($TTC,2));
?>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
如何在用户输入折扣(例如10%)后立即在当前价格文本框中填写新价格?
谢谢您的帮助。
答案 0 :(得分:1)
您可以像这样在价格字段中填写折扣后的金额,请检查下面的代码,希望对您有所帮助,
这里,您正在使用的更新的td和js代码。
谢谢。
<td class="centrer">
<input type="text" name="txtdiscount" value ="" id="txtdiscount_<?php echo $iArticles; ?>" onkeyup="calc(this.value,'<?php echo $iArticles; ?>')"
/>
</td>
<td class="centrer">
<input type="text" name="txtPrice" id="txtPrice_<?php echo $iArticles; ?>" readonly value="<?php echo (number_format($data['price'],2)); ?>" />
<input type="hidden" name="hidden_txtPrice" id="hidden_txtPrice_<?php echo $iArticles; ?>" readonly value="<?php echo (number_format($data['price'],2)); ?>" />
</td>
<tr>
<td class="nocolor"></td>
<td></td>
<td class="centrer bold">VAT</td>
<td class="centrer">
<select name="vatDropdown" id="vatDropdown">
<option value="-1">Select VAT</option>
<option value="1">Yes</option>
<option value="2">No</option>
</select>
</td>
</tr>
<tr>
<td class="nocolor"></td>
<td></td>
<td class="centrer bold">G.Total</td>
<td class="centrer bold" id="grandtotal">
<?php echo (number_format($TTC,2)); ?>
</td>
<input type="hidden" name="hidden_total" id="hidden_total" value="<?php echo (number_format($TTC,2)); ?>" />
</tr>
<script>
function calc(discount, article_id)
{
var price = 0;
var dis_amt = 0;
var calculatedAmt = 0;
var discount_amt = 0;
price = $("#hidden_txtPrice_"+article_id).val();
if(discount != '')
{
dis_amt = parseFloat(discount) / 100;
calculatedAmt = parseFloat(price) * parseFloat(dis_amt);
discount_amt = parseFloat(price) - parseFloat(calculatedAmt);
$("#txtPrice_"+article_id).val(discount_amt);
}
else
{
$("#txtPrice_"+article_id).val(price);
}
}
$("#vatDropdown").on('change', function(){
var dropdown_val = $(this).val();
var grandtotal = $("#hidden_total").val();
if(dropdown_val == '1')
{
var vat_dis = 15 / 100;
var vat_amt = parseFloat(grandtotal) * parseFloat(vat_dis);
var gTotal = parseFloat(grandtotal) + parseFloat(vat_amt);
$("#grandtotal").html(gTotal.toFixed(2));
}
else
{
$("#grandtotal").text(grandtotal);
}
});
</script>