Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

226
Visualizações
Programmatically submit form with "submit" events

I would like to submit a form with vanilla JS, but still trigger submit events. Basically the same as pressing the "submit" button.

HTMLFormElement.submit() skips the "submit" event so it does not work for me.

HTMLFormElement.requestSubmit() seems like it would do what I want, but it's browser support is very poor. I would like Chrome/Safari/Firefox/Edge support.

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

To programmatically submit a form and still trigger a "submit" event, besides using .requestSubmit(), would be to use .click() method on the "submit" button. In the example below are the following:

  • A <form> that will post it's data to a live test server. The test server's response will be displayed in an <frame> located after the <form>.

  • A <button> outside of the <form> and has no form attribute assigned to it either. This button is isolated from the <form> but it will still trigger a "submit" event indirectly since it is registered to the "click" event and the event handler will programmatically click the "submit" button.

  • Note, the <button> is not necessary to use the .click() method, it can be invoked by other means like any other method or function.

Click the Trigger button

<button class='trigger'>Trigger</button>

const trigger = document.querySelector('.trigger');

trigger.onclick = e => document.querySelector('form button').click();
.trigger {
  vertical-align: top
}
<form id='UI' action='https://httpbin.org/post' method='POST' target='response'>
  <fieldset>
    <legend>Programmatically Submit a Form</legend>
    <input name='test' value='TEST'>
    <button name='send'>Send</button>
  </fieldset>
</form>
<hr>
<button class='trigger'>Trigger</button>
<iframe name='response'></iframe>

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda