HTML

Criar botão que não envia formulário em HTML

27 de abril de 2022

Criar botão que não envia formulário em HTML

Neste artigo você vai aprender a como criar botão que não envia formulário, ou seja, um botão dentro de um form que não dá um submit

Criar botão que não envia formulário capa

Fala programador(a), beleza? Bora aprender mais sobre a tag button e formulários de HTML!

Quando criamos um button dentro de um form, ele automaticamente faz o submit quando clicado

Este é o comportamento padrão, pois o atributo que um button tem por padrão é o type com valor de submit

Então para não enviar um form precisamos mudar este atributo

Veja o que pode ser feito:

<button type="button">Do something</button>

Agora o comportamento de envio não é mais válido, o botão não funciona mais como um submit

E é exatamente o que precisamos, agora este botão pode fazer outra coisa ao invés de enviar o formulário

Outra abordagem possível é utilizar o preventDefault no evento que este botão estiver realizando, com a linguagem JavaScript

Conclusão

Neste artigo você aprendeu a como criar botão que não envia formulário

Basicamente precisamos mudar o atributo type para button, isso faz a mágica toda

Pois o valor padrão do atributo é submit, o que faz o envio do form

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os cursos!

Subscribe
Notify of
guest
0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x