Boa tarde a todos vejam se podem me ajudar:
Tenho um campo que mostra o código e o valor de um cartão em uma pagina, e criei um campo para que o usuário digite um valor igual ou menor do que o saldo do cartão e seja alterado no BD (deduzido do saldo), após, voltar na mesma pagina e exibir o saldo atual do produto. na apostila WD-43 existe um javascript para somar os produtos em uma pagina, eu alterei para diminuir mas não estou conseguindo fazer o que preciso segue o codigo que tenho até agora:
<div class="container">
<div class="header clearfix">
<?php
$cartao = new Cartao();
$cartao->setId( $_POST['id'] );
$cartao->setCodigo( $_POST['codigo'] );
$cartao->setValor( $_POST['valor'] );
echo ("* O ID nao esta vazio * "); //Aviso de teste
?>
<br>
<br>
<br>
<br>
<form action="<?=$action ?>" method="post">
<input type="hidden" name="id" value="<?=$cartao->getId() ?>" />
<div class="row">
<div class="col-md-8">
<div class="card">
<center><h3 class="title">Detalhe do Cartão</h3></center>
<p class="category"></p>
</div>
<div class="content table-responsive table-full-width">
<table class="table table-hover table-striped">
<thead>
<th>Codigo do Cartão</th>
<th>Saldo</th>
</thead>
<tbody>
<tr>
<td><?=$cartao->getCodigo() ?></td>
<td id="va"><?=$cartao->getValor() ?></td>
</tr>
</tbody>
</center>
</table>
</div>
</div>
<br>
<br>
<br>
<div class="col-md-4">
<label>Valor a Utilizar</label>
<input class="form-control" id="utilizar" type="text" name="utilizar" autofocus=""
required>
<button class="btn btn-primary" type="submit">Utilizar</button>
</div>
</div>
<br>
<br>
<br>
<center><h3>Saldo do Cartão</h3></center>
<center><div class="col-md-4">
<label for="total">Saldo Total</label>
<output for="qt valor" id="total" class="form-control">
<?= $_POST["valor"] ?>
</output></center>
</div>
</div>
</form>
</div>
segue o javascript da WD-43 que eu alterei um pouco:
var $input_quantidade = document.querySelector("#va");
var $output_total = document.querySelector("#total");
$input_quantidade.oninput = calculaEMostraTotal;
function calculaEMostraTotal(){
var quantidade = $input_quantidade.value;
var valorUnitarioTexto = document.querySelector("#valor").textContent;
var valorUnitarioNumero = realParaNumber(valorUnitarioTexto);
var total = numberParaReal(quantidade - valorUnitarioNumero);
$output_total.value = total;
}