Javascript Event submit

Javascript Event submit

The submit event fires when the user clicks a submit button (<button> or <input type=”submit”>) or presses Enter while editing a field (e.g. <input type=”text”>) in a form. The event(form) is not sent to the form when calling the form.submit() method directly.

Syntax:

HTML:

<element onsubmit="myScript">

In JavaScript:

object.onsubmit = function(){myScript};

EXAMPLE:

html:

<form id="form">
 <label>Test field: <input type="text"></label>
 <br><br>
 <button type="submit">Submit form</button>
</form>
<p id="log"></p>

SCRIPT:

function logSubmit(event) {
 log.textContent = `Form Submitted! Time stamp: ${event.timeStamp}`;
 event.preventDefault();
}

const form = document.getElementById('form');
const log = document.getElementById('log');
form.addEventListener('submit', logSubmit);

OUTPUT: