Prevent a form from being submitted JavaScript


show more Build smarter web forms with JavaScript by creating validation that prevents submission of incomplete forms. Learn how to use the onSubmit event to call an event handler that checks the validity of data in certain HTML form fields when a user clicks Submit. show less
please wait ...

Preventing a form from being submitted

I have a simple page here with a contact form. If I click the Submit button to send this, it's actually popping up this message, "Please provide at least an email address!" and it's stopping me from submitting the form. Let me show you how that's done. The form itself, my HTML, is nothing particularly special. It's a standard form. It's actually submitting just to a local page, but normally you would of course be submitting to a server. I am just going to come down towards the bottom where I have a place, just a span tag with an id of errorMessage, there is nothing in it right now.

Over in my JavaScript, we've got a couple of simple things going on. Let's talk about the simplest one first. I have a window.onload event. That means when the document loads call the function called prepareEventHandlers, so we can forget about the rest of that. This function is called. What it's doing is saying that we want to handle the onsubmit event of the form called fr...

Preventing a form from being submitted
Video duration: 2m 36s 5h 31m Beginner

Viewers:

Build smarter web forms with JavaScript by creating validation that prevents submission of incomplete forms. Learn how to use the onSubmit event to call an event handler that checks the validity of data in certain HTML form fields when a user clicks Submit.

Subjects:
Developer Web
Software:
JavaScript
Author:
please wait ...