how do I multiply values without giving the NaN error?
تبليغسؤال
يرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
I have a script to multiply values but gives me a NaN error, I need the Total Odds to be equal to 0 whenever the cart is empty and calculate the payout which is total Odds * stake amount, how do I make my script work?
here is my html
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Bet Plus 24/7</title>
<script src=”https://code.jquery.com/jquery-3.5.0.js”></script>
<script type=”text/javscript” src=”script.js”></script>
</head>
<body style =”margin:10px;”>
<div class=”cart”>
<div class=”title”>Bet Slip</div>
<div id=”box” class=”boxlit”></div>
<br>
<div>Total Odds: <b id=”ct1″></b></div>
<br>
<div>(N$)Stake: <input id=”stake” type=”number” value=”5″></input><span> NAD</span></div>
<br>
<div>Payout: <b id=”payout”></b></div>
<button class=”bet1″>Bet</button>
<div class=”footer”></div>
</div>
<br>
<table id=”Table1″ class=”Fixtures-Table”>
<thead>
<tr>
<th>League</th>
<th>Home</th>
<th>Draw</th>
<th>Away</th>
<th>Kickoff</th>
</tr>
</thead>
<tbody >
<tr><th>AFF U19 Championship Group Stage<td id=”label” >1<td id=”label” >x<td id=”label” >2</th></tr>
<tr>
<td class=”addItem”>Myanmar U19 – Vietnam U19</td>
<td><input type=”button” class=”decimals” id=”” value =”9.00″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”4.60″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”1.29″ /></td>
<td class=”label”>7/8/2022 10:00</td>
</tr><tr>
<td class=”addItem”>Philippines U19 – Indonesia U19</td>
<td><input type=”button” class=”decimals” id=”” value =”37.00″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”8.25″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”1.04″ /></td>
<td class=”label”>7/8/2022 15:00</td>
</tr><tr><th>Africa Women Cup of Nations<td id=”label” >1<td id=”label” >x<td id=”label” >2</th></tr>
<tr>
<td class=”addItem”>Burkina Faso – Uganda</td>
<td><input type=”button” class=”decimals” id=”” value =”2.65″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”2.85″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”2.55″ /></td>
<td class=”label”>7/8/2022 22:00</td>
</tr><tr>
<td class=”addItem”>Morocco – Senegal</td>
<td><input type=”button” class=”decimals” id=”” value =”2.20″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”2.95″ /></td>
<td><input type=”button” class=”decimals” id=”” value =”3.15″ /></td>
<td class=”label”>7/8/2022 22:00</td>
</tr>
</tbody>
</table>
here is my script for adding to the cart
<script>
$(“.decimals”).each(function(index) {
$(this).attr(“id”, index);
});
let $th = $(‘#Table1 thead th’);
$(“.decimals”).on(‘click’, e => {
let $btn = $(e.target);
let $option = $(`.box[data-id=”${$btn.prop(‘id’)}”]`);
let $tr = $btn.closest(‘tr’);
let selectionIndex = $btn.closest(‘td’).index();
let match = $tr.find(‘td:first’).text().trim();
let result = $th.eq(selectionIndex).text().trim();
let value = $btn.val();
if ($option.length) {
$option.remove();
return;
}
$(“#box”).append(`<div class=”box” data-id=”${$btn.prop(‘id’)}”>${match}<br>${result}<div class=”crtTotal”>${value}</div></div>`);
/// this script calculates the Total Odds it needs to show value as 0 whenever the cart is empty
$(this).click(function() {
let values = $(‘.crtTotal’).map((i, el) => parseFloat(el.textContent)).get();
let total = values.reduce((a, b) => a * b);
$(‘#ct1’).text(total.toFixed(2)).val
})
});
</script>
here is the script for the payout calculation
<script>
$(this).click(function() {
var x = parseInt($(‘#ct1’).text());4
var y = parseInt($(‘#stake’).text());
var net = x * y
$(“#payout”).text(net)
})
</script>
أضف إجابة