Ir ao conteúdo

Javascript Como colocar um input de quantidade numérico em Javascript?


Ir à solução Resolvido por ThomaZ07,

Posts recomendados

  • Solução
Postado

Então galera, sou novo aqui no fórum e estou desenvolvendo um sistema delivery para estudos. Conheço HTML e CSS, e agora estou aprendendo . O projeto está quase todo montado, mas faltou colocar um input de quantidade de produtos. Criei o input number e tentei dessa forma, mas a parte "Quantidade Selecionada" não funciona.. O que estou fazendo de errado? :

<!-- Hamburguer -->

<div class="item-info item-info-7">
  <div class="item-img">
    <img src="img/lanches/hamburger1.jpg" alt="">
  </div>
  <div class="item-txt">
    <strong>hamurguer 7</strong>
    <span class="item-sub-txt"> Um lindo hamburguer</span>
  </div>

  <div class="item-numeros-container">
    <div class="item_valor">
      <div>R$ 8,00</div>
    </div>

    <div class="item_quant">
      <div>
        <input type="checkbox" value=8,00 name="item-checkbox" class="item-checkbox"
               id="hamburguer7">
      </div>

      <input class="quantidade" type="number" min="0"> 
    </div>
    <div class="item_add">
      <i class="faz fa-plus btnAdd7"></i>
    </div>
  </div>

  <div id="adicionais-7" class="adicionais hidden ">
    <div class="itens-adicionais">
      <strong>Adicionais</strong>
      <ul class="radios-add">
        <li><input type="checkbox" class="input-add" value=3,00 name="" alt="hamburguer7"
                   id="alho"> alho</li>
        <li>R$3,00</li>

        <li><input type="checkbox" class="input-add" value=3,00 name="" alt="hamburguer7"
                   id="cebola"> cebola</li>
        <li>R$3,00</li>



      </ul>
    </div>

  </div>

 

 

//Botão de enviar as informações

$(document).ready(function(){

$("#enviar").click(function(){
   var nome=$("#nome").val()
   var endereco=$("#endereco").val()
   var numero=$("#numero").val()
   var bairro=$("#bairro").val()
   var observacao = $("textarea").val()
   
   // FORMA de pagamento selecionada
   const formasDePagamento= document.querySelectorAll("form input[type=radio]")
   var formaSelecionada = ""
   if(formasDePagamento[0].checked){
       formaSelecionada = "Dinheiro"
    } else if (formasDePagamento[1].checked) {
        formaSelecionada =" Cartão de Crédito"
    } else {
        formaSelecionada = "Cartão de Débito"
        
    }

  
    // Pedido Selecionado
    
    var pedido = "" 
    const pedidosDisponiveis = document.querySelectorAll("input[type=checkbox]")
    var pedidoSelecionado = ""
    var soma = 0; 
    for ( pedido of pedidosDisponiveis) {
        var pedidoSelecionados = pedido.checked
        
        if(pedido.checked == true) {
            pedidoSelecionado +=` ${pedido.id} -> ${pedido.value} Reais; ` 
            var pedidosValores  =  parseInt(pedido.value)
            soma += pedidosValores   
        }
    }
   
   // Quantidade Selecionada

    var quantidade = document.querySelectorAll("input[type=number]")
    var quantidadeSelecionada = ""
    for (quantidade of quantidadesDisponiveis){
        if(quantidade.checked == true){
            var quantidadeValores = parseInt(quantidade.value)
            soma += quantidadeValores
        }
        
    }
    




    // Adicional Selecionado
    
    const AdicionaisDisponiveis = document.querySelectorAll("item_add[type=checkbox]")
    var adicionalSelecionado = ""
    for (adicional of AdicionaisDisponiveis){
        if(adicional.checked == true){
            adicionalSelecionado +=` ${adicional.alt} - Adicional: ${adicional.id} -> ${adicional.value} Reais;`
            var adicionaisValores = parseInt(adicional.value)
            soma += adicionaisValores
        }
        
    }
    
    //Taxa de entrega
    var TaxaDeEntrega = 0;
    var bairro = ""
    const Bairros = document.querySelectorAll("option")
    if(Bairros[1].selected==true){
        bairro = ''
        TaxaDeEntrega += parseInt(Bairros[1].value)
        
    } else if(Bairros[2].selected==true){
        TaxaDeEntrega += parseInt(Bairros[2].value)
        bairro = ''
    } else if(Bairros[3].selected==true) {
        TaxaDeEntrega += parseInt(Bairros[3].value)
        bairro = ''
        
    } else if(Bairros[4].selected==true) {
        TaxaDeEntrega += parseInt(Bairros[4].value)
        bairro = ''
        
    } else if (Bairros[5].selected==true) {
        TaxaDeEntrega += parseInt(Bairros[5].value)
        bairro = ''

    } else if (Bairros[6].selected==true) {
        TaxaDeEntrega += parseInt(Bairros[5].value)
        bairro = ''
        
    } else {
        TaxaDeEntrega += parseInt(Bairros[7].value)
        bairro = ''
    }

    var cupom = $("#cupom").val()
       if( cupom == 'cupom10' ) {
       var desconto = 10
    }else{ 
    if( cupom == '' ) {
    var desconto = 0
 }       
}


var texto=`${nome};${endereco}; ${bairro}; ${numero}; ${observacao}; 
// Forma de pagamento: ${formaSelecionada}, Pedido: ${pedidoSelecionado}, ${adicionalSelecionado}, ${quantidadeSelecionada} 
Valor do Pedido = ${soma},00 
;Taxa de entrega = ${TaxaDeEntrega},00
;Desconto = ${desconto},00 
;Valor Total: ${(soma+TaxaDeEntrega) - desconto},00`

var site="&text="+texto.replace(" ","%20","%0a")

if(confirm("Confirma seu pedido?")){
    window.location.href=site;
} else {
}
})
})

 

  • 2 semanas depois...
Postado

@ThomaZ07 Dois pontos ai no seu código.

A variavel quantidade está conflitando (sendo redefinida) com a constante definida no "for (quantidade of quantidadesDisponiveis)"

 

Segue a parte do código com problema.

 

var quantidade = document.querySelectorAll("input[type=number]")
    var quantidadeSelecionada = ""
    for (quantidade of quantidadesDisponiveis){
        if(quantidade.checked == true){
            var quantidadeValores = parseInt(quantidade.value)
            soma += quantidadeValores
        }

    }

 

 

Outra coisa é que não consegui encontrar onde você define a variavel quantidadesDisponiveis

Crie uma conta ou entre para comentar

Você precisa ser um usuário para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...

LANÇAMENTO!

eletronica2025-popup.jpg


CLIQUE AQUI E BAIXE AGORA MESMO!