-2
J'ai un calculation table et le total devient NaN après l'addition de 10 rangées. J'ai même essayé les suggestions comme indiqué dans ce Stackoverflow article. Je l'ai testé depuis plus d'une journée et je ne peux pas corriger l'erreur. Qu'est-ce que je rate?Le total devient NaN après incrément 10
jQuery(document).ready(function($){
var counter = 2;
$("#addItem").click(function() {
if(counter>50){
alert("You have reached the maximum items allowed (50)!");
return false;
}
var newTextBoxDiv = $(document.createElement('tr'))
.attr("id", 'itemRow' + counter);
newTextBoxDiv.after().html('<td class="first"><input placeholder="Charge # ' + counter + '" class="chrg" type="text" name="data[' + counter + '][0]" id="chrg' + counter + '" ></td>' + '<td><input placeholder="Item/Part # ' + counter + '" class="item" type="text" name="data[' + counter + '][1]" id="item' + counter + '" ></td>' + '<td><input placeholder="Description ' + counter + '" class="desc" type="text" name="data[' + counter + '][2]" id="desc' + counter + '" ></td>' + '<td style="text-align:center;"><input placeholder="Qty ' + counter + '" class="qty" type="text" name="data[' + counter + '][3]" id="qty' + counter + '" size="5" style="text-align:center;" /></td>' + '<td style="text-align:right;"><input placeholder="Cost ' + counter + '" class="cost" type="text" name="data[' + counter + '][4]" id="cost' + counter + '" size="10" style="text-align:right;" /></td>' + '<td style="text-align:right;"><span class="input-group-addon">$</span><input placeholder="Sub-Total ' + counter + '" class="stotal" type="text" name="stotal'+ counter + '" id="stotal'+ counter +'" size="10" style="text-align:right;" readonly /></td>');
newTextBoxDiv.appendTo("#TextBoxesGroup");
counter++;
});
$(document).on('keyup', '.cost', function(st){
// grab ID to get row number
thisID = $(this).attr("id");
rowNum = thisID.slice(-1);
//get Amount entered
qty = $('#qty'+rowNum).val();
//get QTY
cost = $('#cost'+rowNum).val();
$('#stotal'+rowNum).val((qty*cost).toFixed(2));
currentCount = counter-1;
var tot = Math.round(0);
$('.stotal').each(function() {
tot += parseFloat($(this).val());
});
\t $('#preTotal').val((tot).toFixed(2));
\t $('#grand_total').val((tot).toFixed(2));
});
\t
//calculate preTotal
$(document).on('focusin', '#shipping', function(pt){
\t var selection = document.getElementById("addShip");
\t \t if (selection.checked){
\t \t $("#shipping").change(function(preTotal,shipping) { // input on change
\t \t var preTotal = document.getElementById('preTotal').value;
\t \t var shipping = document.getElementById('shipping').value || 0;
\t \t var pTotal = parseFloat(shipping) + parseFloat(preTotal); \t \t
\t \t
\t \t document.getElementById('preTotal').value = (pTotal.toFixed(2));
\t \t });
\t \t } else {
\t \t var preTotal = document.getElementById('preTotal').value;
\t \t var shipping = document.getElementById('shipping').value || 0;
\t \t var sTotal = parseFloat(preTotal); \t \t
\t \t
\t \t document.getElementById('preTotal').value = (sTotal.toFixed(2));
\t \t }
\t });
//calculate taxes and total
$(document).on('focusin', '#taxTotal', function(tt){
\t var selection = document.getElementById("addShip");
\t \t //get field results \t \t
\t \t var preTotal = document.getElementById('preTotal').value || 0;
\t \t var shipping = document.getElementById('shipping').value || 0;
\t \t var taxTotal = document.getElementById('taxTotal').value || 0;
\t \t var taxRate = document.getElementById('taxRate').value || 0;
\t \t var gTotal = document.getElementById('grand_total').value || 0;
\t \t $("#taxTotal").change(function() { // input on change
\t \t var tTotal = document.getElementById('taxTotal').value/document.getElementById('preTotal').value * 100;
\t \t document.getElementById('taxRate').value = (tTotal.toFixed(2));
\t \t });
});
\t
//calculate total + taxes
$(document).on('focusout', '#taxTotal', function(gt){
\t \t var shipping = document.getElementById('shipping').value || 0;
\t \t var tTotal = document.getElementById('taxTotal').value || 0;
\t \t var gTotal = document.getElementById('grand_total').value;
\t \t var fTotal = parseFloat(shipping) + parseFloat(tTotal) + parseFloat(gTotal);
\t \t document.getElementById('grand_total').value = (fTotal.toFixed(2));
});
});
}
function focusField() {
$('#addItem').click(function(){
$('.chrg').focus();
\t });th \t \t \t \t {padding: 2px 2px;}
td \t \t \t \t {padding: 2px 2px;}
input \t \t \t {padding: 0px 2px;}
#addItemBtn \t {}
input.filler \t {border-color:#fff;border-style:solid;}
.input-group-addon {
padding: 2px 5px;
font-size: 14px;
font-weight: 400;
line-height: 1;
color: #555;
text-align: center;
background-color: #eee;
\t box-shadow: inset 0 0 0 1px grey;
\t border-right: 1px #eee solid;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="TextBoxesGroup" style="width:100%;">
<tr>
\t \t <th style="text-align:left;">Charge #</th>
<th style="text-align:left;">Item/Part #</th>
<th style="text-align:left;">Description</th>
<th style="text-align:center;">Qty</th>
<th style="text-align:right;">Cost</th>
<th style="text-align:right;">Sub-total</th>
</tr>
<tr id="itemRow1">
<td><input placeholder="Charge # 1" class="chrg" type="text" id="chrg1" autofocus /></td>
<td><input placeholder="Item/Part # 1" class="item" type="text" id="item1" style="margin-bottom:0 !important" /></td>
<td><input placeholder="Description 1" class="desc" type="text" id="desc1" /></td>
<td style="text-align:center;"><input placeholder="Qty 1" class="qty" type="text" id="qty1" size="5" style="text-align:center;" /></td>
<td style="text-align:right;"><input placeholder="Cost 1" class="cost" type="text" id="cost1" size="10" style="text-align:right;" /></td>
<td style="text-align:right;"><span class="input-group-addon">$</span><input placeholder="Sub-Total 1" class="stotal" type="text" id="stotal1" size="10" style="text-align:right;" readonly /></td>
</tr>
</table>
<table style="width:100%;">
<tr id="rowFiller">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><input class="btn btn-primary" type="button" id="addItem" value="Add Item" size="10" style="float:right;" onclick="focusField()" /></td>
</tr>
<!--<tr id="addItemBtn">
\t <td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><input type="button" id="addItem" value="Add Item" style="float:right;" /></td>
</tr>-->
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td style="text-align:right;">
<label style="padding-right:5px;">remove shipping from taxable total
<input type="checkbox" id="addShip" class="addShip" name="addShip" checked ></label>
</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td style="text-align:right;">
<label style="font-weight:bold;padding-right:5px;display:inline-block;">Shipping</label>
<span class="input-group-addon">$</span>
<input placeholder="$00.00" name="shipping" id="shipping" size="10" style="float:right;text-align:right;" />
</td>
</tr>
<tr>
<td></td>
<td></td>
<td style="text-align:right;">
<label style="font-weight:bold;padding-right:5px;display:inline-block;">Pre-Total</label>
<input name="preTotal" id="preTotal" size="10" style="float:right;text-align:right;" readonly /></td>
<td></td>
<td>
</td>
<td style="text-align:right;">
<div style="text-align:right;display:inline;border-right:1px #ccc solid;margin-right:5px;">
<label style="font-weight:bold;padding-right:5px;display:inline-block;">Tax</label>
<input placeholder="00" class="taxRate" name="taxRate" id="taxRate" size="1" style="text-align:center;" />
<label style="font-weight:bold;display:inline-block;">%</label>
</div>
<label style="font-weight:bold;padding-right:5px;display:inline-block;">Total Tax</label>
<span class="input-group-addon">$</span><input placeholder="$00.00" name="taxTotal" id="taxTotal" size="10" style="float:right;text-align:right;" />
</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td style="text-align:right;font-weight:bold;"><label style="font-weight:bold;padding-right:5px;display:inline-block;">Grand Total</label>
<span class="input-group-addon">$</span><input placeholder="$00.00" name="grand_total" id="grand_total" size="10" style="float:right;text-align:right;" readonly /></td>
</tr>
</table>
Veuillez ajouter une balise de la langue que vous programmez/scriptez à la question. – progyammer
Vous avez vraiment besoin de réduire ce problème à moins de code. Je doute sérieusement qu'un nombre soit en train de devenir NaN après en avoir ajouté 10. Plus probablement un scénario est le nombre que vous pensiez réel est réellement NaN, alors vous ajoutez 10 à cela. – Carcigenicate
Oups, réalisé que j'ai mal compris le problème. La suggestion est toujours là. Il y a beaucoup de code ici, et je doute que 90% de cela soit même pertinent. – Carcigenicate