Jump to content
  • 0
Guh Domingues

Duvida com o submit de uma div

Question

fgd.PNG.af0688eb5ce38b1fd9ae04f9c9aa4138.PNG

 

Ao digitar o Cep e apertar enter, o produto e adicionado no carrinho,  ao invés de "Calcular o frete". Para calcular o frete tem que digitá-lo e aperta o Button "Calcular Frete".

 

Eu queria saber se tem alguma maneira mais fácil de inserir algum código na div do campo input e ao apertar enter executar a div "Calcular Frete" ao em vez de Executar o Button "Comprar". Que automaticamente envia o produto para o Carrinho.

Share this post


Link to post
Share on other sites

1 answer to this question

Recommended Posts

  • 0

Se eu entendi seu caso....

Tanto o input text como o input "calcular frete" e o input "comprar" estão em um único form, é isso?

Não, pois como disse não entendi direito o seu problema, mas se for o que eu estou pensando fiz um exemplo simples aqui de como você pode ter 2 ou mais submits em um único form.

Spoiler

<form method="POST">
    <input name="cep" id="cep" type="text" placeholder="digite o cep aqui"/>
    <input name="valor" id="valor" type="hidden" />
    <button onclick="return calcularFrete()">Calcular frete</button>
    <hr />
    <button onclick="return comprar()">Comprar</button>

    <div id="mostra_o_resultado"></div>
</form>

<script>
function calcularFrete() {
    var resultado = document.getElementById('mostra_o_resultado'); // Pegar o elemento onde vou testar o código
    var cep = document.getElementById('cep').value; // Pego o valor do input do cep
    if (!cep) { // Valor de cep está vazio
        resultado.innerHTML = "Informe seu CEP";
    } else {
        var calc = calculo(cep); // Envio o cep digitado para a função calcular
        document.getElementById('valor').value = calc; // Insiro o valor do calculo em um input oculto
        resultado.innerHTML = 'Valor do frete: ' + calc; // Mostro o teste.
    }
    return false;
}


function comprar() {
    var resultado = document.getElementById('mostra_o_resultado'); // Pegar o elemento onde vou testar o código
    var valor = document.getElementById('valor').value; // Pego o resultado do calculo
    var cep = document.getElementById('cep').value;
    var resposta; // Uso para depuração
    if (!valor) { // Valor do frete ainda não foi calculado
        resposta = 'Você tem que calcular o frete primeiro';
    }else {
        resposta = 'Validadando o form<br><b>CEP</b> informado: ' + cep + ' /total do frete <b>frete</b>: ' + valor;
    }
    document.getElementById('mostra_o_resultado').innerHTML = resposta;
    return false;
}

function calculo(cepRecebido) {
    /*
     * Não sei como é sua função que calcula o frete então vou retornar qualquer coisa por exemplo mesmo.
     * Mas de qualquer forma o calculo deve ser baseado o parâmetro recebido.
     */
    var a = 5;
    var b = (a * 5);
    return b;
}
</script>

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By rcsbnu27
      Estou tentando ajudar um amigo a desenvolver seu site pessoal ele me passou um modelo, onde não estou conseguindo fazer um link de menu quando clicar nos anos iniciais ir para as turmas dos anos iniciais no menu atividade educacionais, segue em anexo o código. Endereço para ter ideia do que estou falando: https://www.profrodrigo.com/temporario/index.html. Nesta parte:
      HTML
      <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#anosiniciais" > <img src="images/anos/anosiniciais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#anosfinais" > <img src="images/anos/anosfinais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div> </div> </div> <div class="section news-section" id="anosiniciais"> <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/pres.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/1sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/2sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/3sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/4sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div>

      <div class="section news-section" id="anosfinais">
      <div class="container">
      <div class="row">
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/5sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="https://www.ebmalbertostein.com" target="_blank">
      <img src="images/turmas/6sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="https://www.profgarrido.com" target="_blank">
      <img src="images/turmas/7sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/8sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/9sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      </div>
      </div>
      </div>
    • By marcossantana10
      Amigos, estou com o seguinte problema: quando monto meu formulário dinamicamente, ao clicar no botão submit é dado um refresh na página, ao invés de realizar o submit. Esse formulário busca todos os registros de uma dada categoria no banco de dados e os monta na página para que possam ser editados individualmente.
      Segue o código:
      //montando os formulários:
          $.each(responseJson, function(key, value){                                 var itens = "<div class='card_nbl'><div class='container_nbl'><div class='text_card_nbl update_info_consulta'><form name='updateProntuario' method='post'><label style='text-align: left;' for='prontuario'>Consulta:</label><textarea name='prontuario' class='input_full' style='resize: none; height: 100px; padding-top: 10px; margin-top: 5px;' id='prontuario'>"+value.descricao+"</textarea><label style='text-align: left;' for='info_sigilosa'>Informações sigilosas:</label><br><textarea name='info_sigilosa' class='input_full' style='resize: none; height: 100px; padding-top: 10px; margin-top: 5px;' id='info_sigilosa'>"+value.info_sigilosa+"</textarea><input type='submit' name='salvar' value='Salvar' class='btn btn_padrao'></form></div></div></div>"                                 $("#item1mobile").append(itens)                             })  
      Minha função de submit:
          $(function(){                 $('form[name=updateProntuario]').submit(function(){                     $.ajax({                         type: 'POST',                         url: 'www',                         dataType: 'json',                         data: $(this).serialize(),                         success: function(data){                             $("#loading").attr("class", "loading")                             swal_sucesso("Tudo certo!", "As informações sobre a consulta foram atualizadas.")                         }                     });                 return false;                 })             }) OBS: quando eu faço o formulário direto no HTML (sem montar vários itens com um laço, como acima), o submit funciona normalmente.
       
    • By lezão
      Ola pessoal!
      Td bem com vcs?
       
      Estou tentando fazer esse item ficar em css e naun estou conseguindo alguem pode me ajudar?
      <table width="75%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="15%" height="35"><b>Moda da Casa</b></td> <td width="55%" style="border-bottom: dotted; border-width: 1px 3px 3px 1px; border-color: black black #000000 #000000"></td> <td width="7%"><b>R$ 25,00</b></td> <td width="3%" rowspan="2" align="left"><img src="https://clipartart.com/images/delete-button-clipart.jpg" width="75px" heigth="50px"/></td> </tr> <tr> <td colspan="3" height="35"> <div class="label-float"> <input type="text" value="Molho de tomate, mussarela, calabresa ralada, catupiry, alho tostado, cebola, azeitonas e oregano." size="100%" placeholder="" required=""> </div> </td> </tr> </table> obrigado!
       
       
       
    • By lezão
      Boa noite!
      Td bem com vcs?
       
      Meus amigos, estou precisando de um css que eu não faço ideia por onde começar ja pesquisei e nada.
      só encontrei como imagem, vejam.

       
      será que tem como fazer em css desse modelo, o texto tem q ficar sobreposto a cor do fundo.
       
    • By FabianoSouza
      Pessoal, é possível abrir uma nova aba/janela do navegador dentro de uma DIV?
      Como faço?
       
      Pergunto isso porque o IFRAME não vai funcionar para o meu objetivo (já testei).
       
      Estou tentando adaptar esse código JQUERY para o Javascript puro, pra saber se a ideia funciona (não manjo de JQUERY).
      https://stackoverflow.com/questions/33296867/how-to-open-the-content-inside-a-div-tag-in-new-tab
       
      Grato.
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.