Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Não seleciona a pista

Referente ao curso Lógica de programação: praticando com desafios, no capítulo Projeto Ingresso Online e atividade Apresentação do projeto Ingresso Online

por Pedro Ernesto Silva da Cunha
| 159.6k xp | 178 posts

Eu creiei esse código:

var pista = document.getElementById('qtd-pista');
var superior = document.getElementById('qtd-superior');
var inferior = document.getElementById('qtd-inferior');


var seletorSuperior = document.getElementById('superior').textContent;
var seletorSuperiorPartido = seletorSuperior.split(' ')[1].split('2')[0];



var seletorPista = document.getElementById('pista').textContent.toLowerCase();
var seletorPistaPartido = seletorPista.split('1')[0];
console.log(seletorPistaPartido)



var seletorInferior = document.getElementById('inferior').textContent;
var seletorInferiorPartido = seletorInferior.split(' ')[1].split('4')[0];
//console.log(seletorInferior)

console.log('pista' === 'pista')


var qtdPista = parseInt(pista.textContent);
var qtdSuperios = parseInt(superior.textContent);
var qtdInferior = parseInt(inferior.textContent);


function comprar(){
    var tipoPoltrona = document.getElementById('tipo-ingresso').value;
    console.log(tipoPoltrona);
    var qtd = parseInt(document.getElementById('qtd').value);
    //console.log('oi1');
    if(tipoPoltrona === seletorPista){
        qtdPista = qtdPista - qtd;
        pista.textContent = qtdPista;
        //console.log('oi2');
    }else if(tipoPoltrona === seletorSuperiorPartido){
        qtdSuperios = qtdSuperios - qtd;
        superior.textContent = qtdSuperios;
        //console.log('oi3');
    }else{
        qtdInferior = qtdInferior - qtd;
        inferior.textContent = qtdInferior;
        //console.log('oi4');
    }
}

o único que não vai é pista, todos os outros dão certo, poderia me explicar o que está dando errado?

2 respostas
por Pedro Ernesto Silva da Cunha
| 159.6k xp | 178 posts
<main class="container">

        <div class="grafismo"></div>
        <h1>Compre seu <span>ingresso</span></h1>
        <form action="">
            <label class="input-group">
                Escolha o tipo
                <select name="tipo-ingresso" id="tipo-ingresso">
                    <option value="inferior">Cadeira inferior</option>
                    <option value="superior">Cadeira superior</option>
                    <option value="pista">Pista</option>
                </select>
            </label>
            <label class="input-group">Qtde.
                <input type="number" id="qtd" placeholder="00" min="1" max="10">
            </label>
            <button onclick="comprar()" type="button">Comprar</button>
        </form>
        <img class="hachuras" src="./assets/SVG/Hachuras.svg" alt="">
        <section>
            <h2>Quantidade disponível</h2>

            <ul class="lista">
                <li id="pista">Pista<span id="qtd-pista">100</span></li>
                <li id="superior">Cadeira superior<span  id="qtd-superior">200</span></li>
                <li id="inferior">Cadeira inferior<span  id="qtd-inferior">400</span></li>
                
            </ul>
            <img src="./assets/Ingresso.svg" alt="">
        </section>
    </main>
solução!
por Armano Barros Alves Junior
| 2314.4k xp | 4752 posts
Alura Scuba Team Monitor | Suporte Educacional

Olá, Pedro! Tudo bem?

Analisando os códigos que você compartilhou e realizando alguns testes, identifiquei que o seu problema está concentrado na função comprar.

Nela você faz a comparação do tipoPoltrona com os seletores pré-definidos e formatados, contudo, no da pista você estava usando a informação do seletor sem a formatação que retirava o "100" a frente do nome "pista", como você estava usando a versão sem essa retirada, a comparação retornava false.

Com isso, para corrigir o seu código, você precisar utilizar a variável correta na comparação. Segue o código corrgido:

function comprar(){
    var tipoPoltrona = document.getElementById('tipo-ingresso').value;
    console.log(tipoPoltrona);
    var qtd = parseInt(document.getElementById('qtd').value);
    //console.log('oi1');
    if(tipoPoltrona === seletorPistaPartido){
        qtdPista = qtdPista - qtd;
        pista.textContent = qtdPista;
        //console.log('oi2');
    }else if(tipoPoltrona === seletorSuperiorPartido){
        qtdSuperios = qtdSuperios - qtd;
        superior.textContent = qtdSuperios;
        //console.log('oi3');
    }else{
        qtdInferior = qtdInferior - qtd;
        inferior.textContent = qtdInferior;
        //console.log('oi4');
    }
}

Basicamente, alterei na primeira comparação a variável seletorPista para seletorPistaPartido.

Espero ter ajudado e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.