Estou em dúvida em relação ao botão de salvar e o envio do formulário. Como que está atribuído o envio do formulário ao botão de salvar? No caso, na estrutura do HTML o botão de salvar não teria que ter o atributo type="submit"?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Estou em dúvida em relação ao botão de salvar e o envio do formulário. Como que está atribuído o envio do formulário ao botão de salvar? No caso, na estrutura do HTML o botão de salvar não teria que ter o atributo type="submit"?
Olá, Arthur! Tudo bem?
Você está certo em pensar que o botão de salvar normalmente precisa ter o atributo type="submit" para disparar o evento submit do formulário. Mas, nesse caso, o botão não precisa ser o responsável por disparar o evento pois recorremos ao JavaScript. O formulário em si está configurado para ouvir o evento submit e executar uma função quando ele for disparado.
No nosso código JavaScript, estamos usando o método addEventListener('submit', ...) para dizer ao formulário: "Quando você receber um evento submit, execute a função dentro do addEventListener". Então, quando você clica no botão de salvar, o navegador não está disparando o evento submit diretamente no botão. O que acontece é que o clique no botão dispara um evento de clique no próprio formulário. Como o formulário está ouvindo o evento submit, a função dentro do addEventListener é executada.
Em outras palavras, o formulário está sempre "esperando" por um evento do tipo submit e, quando se dá a interação com o formulário, ele é disparado e executa a função que foi definida no addEventListener.
Para testar essa ideia, você pode tentar remover o addEventListener('submit', ...) do código e ver se o evento submit ainda é disparado quando o botão de salvar é clicado.
Espero que essa explicação tenha ajudado a esclarecer a sua dúvida! Caso tenha dúvidas, conte com o fórum!
Um aabraço e bons estudos!