Ir ao conteúdo

Javascript Não consigo validar input number


Ir à solução Resolvido por ThomaZ07,

Posts recomendados

  • Solução
Postado

Estou desenvolvendo um projeto para estudos e estou com uma dificuldade enorme para validar um input number. Já tentei diversas maneiras e sempre ou aparece "false" ou em branco. Não sei o que estou fazendo de errado. Só falta essa etapa pra conclusão. Alguém poderia ajudar? Obs: Sou iniciante, conheço mais HTML e CSS e estou me aprofundando em Javascript.

 

// 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   
            }
        }

        //esse number que não consigo
        var quantidadeDisponiveis = document.querySelectorAll("item_quant[type=number]")
        var quantidadeSelecionado = ""
        for ( quantidade of quantidadeDisponiveis) {
            var quantidadeSelecionado = quantidade.checked
            
            if(quantidade.checked == true) {
                quantidadeSelecionado +=` ${quantidade.id} -> ${quantidade.value} Reais;` 
                var quantidadesValores  =  parseInt(quantidade.value)
                pedidoSelecionado *= quantidadeValores   
            }
        }


        

        $(".btnAdd6").click(function(i){
        $('#adicionais-6').toggleClass('hidden')
        $('.item-info-6').toggleClass('alturaAuto')
        $('.item_quant').toggleClass('alturaAuto')


        })


	 // 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
            }
            
        }
        
<article class="itens-container">
                                    
                                  
        <!-- Melancia -->

        <div class="item-info item-info-6">
            <div class="item-img">
                <img src="img/lanches/melancia.jpg" alt="">
            </div>
            <div class="item-txt">
                <strong>Melancia</strong>
                <span class="item-sub-txt"> Uma linda melancia</span>
            </div>

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

                <div class="item_quant">
                    <div>
                        <input type="checkbox" value=4,00 name="item-checkbox" class="item-checkbox"
                            id="Melancia">

                            <input type="number" value="" name="quantidade" class="quantidade">
                                


                    </div>
                </div>
                <div class="item_add">
                    <i class="faz fa-plus btnAdd6"></i>
                </div>
            </div>

            

            <div id="adicionais-6" 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="Melancia"
                                id="Maça"> Maça</li>
                        <li>R$3,00</li>

                        <li><input type="radio" class="input-add" value=3,00 name="" alt="Melancia"
                                id="Banana"> Banana</li>
                        <li>R$3,00</li>

                    </ul>
                </div>

            </div>
            
        </div>
                             
        </article>

 

Postado

Fiz um exemplo básico de como obter o valor de um input.

 

HTML:

<input type="number" name="quantidade" class="quantidade">
<br />
<button onclick="obterValor()"> Obter Valor</button>

 

JS:

function obterValor() {
  alert(document.querySelector(".quantidade").value)
}

Link codepen: https://codepen.io/ruiguilherme/pen/yLVdjOQ?editors=1010

 

Vale lembrar que se o type for number e você digitar algo que não seja number, o value do JavaScript não vai pegar os dados, exemplos:

 

input: 123

resultado: 123

input: 123a

resultado: null

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...

Ebook grátis: Aprenda a ler resistores e capacitores!

EBOOK GRÁTIS!

CLIQUE AQUI E BAIXE AGORA MESMO!