Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] O alert aparece mesmo o input não estando vazio

Bom dia, estou com algum problema no meu código que não consigo identificar. Quando eu deixo o input vazio, o alert é exibido normalmente, porém quando escrevo algo, o mesmo acontece. Ele entra na condicional do mesmo jeito. O que pode estar errado?

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta
solução!

Oi Estudante,

O problema está na forma como você está capturando o valor do input.

A variável inputItem está sendo definida fora do escopo do evento de clique, ou seja, ela é lida apenas uma vez quando o script é carregado. 🤔

Para corrigir isso, você precisa pegar o valor do input dentro da função do evento de clique, assim o valor será atualizado a cada clique. 😜

const inputItem = document.getElementById("input-item");
const botaoAdicionar = document.getElementById("adicionar-item");

botaoAdicionar.addEventListener("click", (evento) => {
  evento.preventDefault();

  if (inputItem.value === "") {
    alert("Por favor, insira um item!");
    return;
  }
  
  const itemDaLista = document.createElement("li");
  const containerItemDaLista = document.createElement("div");
  containerItemDaLista.classList.add("lista-item-container");
});

Para saber mais: Documentação sobre Eventos do DOM - Aprenda mais sobre como os eventos funcionam no DOM e como utilizá-los corretamente.

Continue praticando e aprofundando seus conhecimentos! 🧐