Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Criação de Função

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;
}
3 respostas

O seu id="va" ta referencia uma td, que não é um input e logo não tem a propriedade value nele.. Parece que o código do wd-43 não é suficiente... vc precisa adaptar para lidar com uma tabela.

Obrigado Alberto, realmente você me chamou atenção. É isso mesmo, o js do WD-43 faz uma operação dentro de uma listagem e o meu input é o button.

Eu já tentei fazer algumas alterações, mas continuo sem sucesso eu não sei como fazer. A minha idéia é o button enviar para o js, tratar e me mostrar o saldo, e ao mesmo tempo encaminhar para o altera-cartao e retornar o saldo de volta para essa minha página e exibir para o usuário.

Você sabe de alguma apostila que tenha algo parecido com meu problema? Pode ser livro da Casa do Código também, eu tenho o de Php do Evaldo Junior mas não trata desse problema. Tenho e já pesquisei a apostila FP-73, a WD-47 também não tem um JS que resolva isso.

Muito obrigado

solução!

Boa noite a tudos, depois da ajuda do instrutor Alberto que abriu meus olhos pude enxergar que a solução utilizando Javascript da forma como eu havia pensado não funcionaria neste caso, procurei uma solução caseira utilizando todo o processo de altera-produto da apostila FP-73 ou seja utilizando Php puro e um Sql (pagina 23 da apostila ALURA - SQL ) para ajudar:

De acordo com o HTML que postei no inicio:

Primeiro: Alterei o meu formulário para que todos os campos sejam "div class="form-group" e trago os valores do banco de dados nos dois primeiros campos e deixo o ultimo para o usuario digitar o valor que deseja utilizar. Assim consigo fazer o envio de todos os dados pelas paginas que preciso.

Depois, esconder os campos que trazem o código e o valor com readonly="true" para que o usuário não altere esses valores, apenas o campo "utilizar" possa ser preenchido.

Em seguida: Envio o formulário para a pagina altera-cartao (ou o nome que desejar) onde faz o recebimento dos dados e prepara para enviar ao banco-cartão onde utilizei uma função "atualizaCartao" onde pego o valor que já veio do html e diminuo do valor que o usuario deseja utilizar no nosso formulário html:

function atualizaCartao($conexao, $cartao) {
$query = "update cartao set valor = {$cartao->getValor()} - {$cartao->getUtilizado()} where id = {$cartao->getId()}";

return mysqli_query($conexao, $query);

}

Funcionou que foi uma beleza!!!!

Qualquer duvida estou a disposição.

abraços a todos

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software