Simple form required field validation.

Posted on 2011-02-12
Medium Priority
Last Modified: 2012-05-11

Im trying to find a simple script to let me validate 4 required fields in my form.
If one of them is empty an alert box should display which fields are missing without letting the form submit.

The form has been built. It submits to a PHP script fine.

I cant find a simple validation script that I can plug into it. They all seem over complicated.

Does anyone have anything ready to plugin?

Thanks for your help
Question by:SM17CH
  • 2

Accepted Solution

xav056 earned 800 total points
ID: 34881228
LVL 75

Assisted Solution

by:Michel Plungjan
Michel Plungjan earned 1200 total points
ID: 34881559
Poor example.
They do not even pass the form to the function

Here is the canonical way to validate a form - it will work on all browsers since the beginning of time
It would have been useful to see your form code however. In this case I will have to guess at the field names and not handle radio/checkboxes
function validate(theForm) { // passing the form itself to the function
  var firstName=theForm.firstName.value;
  if (firstName=="") {
    alert("Please enter your First Name");
    theForm.firstName.focus(); // return the cursor to the field
    return false; // cancel the submission

  var lastName=theForm.lastName.value;
  if (lastName=="") {
    alert("Please enter your Last Name");
    theForm.lastName.focus(); // return the cursor to the field
    return false; // cancel the submission

  // repeat the above for each field
  return true; // when we get to here, all fields validates, allow submission

// the following is a courtesy function to place the cursor in the first field 
window.onload=function() {
  document.forms[0].firstName.focus(); // forms[0] is the first form on the page
<form onsubmit="return validate(this)">
<input type="text" name="firstName" value="" />
<input type="text" name="lastName" value="" /><br />
<input type="submit" />

Open in new window


Author Comment

ID: 34881666
Yep that works,

I ended up doing a simlar thing from another tutorial I found.

<script type="text/javascript">
function validateForm()
var x=document.forms["booking"]["First-Name"].value
var y=document.forms["booking"]["Last-Name"].value
var z=document.forms["booking"]["Phone-Number"].value
var w=document.forms["booking"]["Suburb"].value
if (x==null || x=="" || y==null || y=="" || z==null || z=="" || w==null || w=="")
  alert("Please complete all required fields (*)");
  return false;

Open in new window

LVL 75

Expert Comment

by:Michel Plungjan
ID: 34881741
I will argue that my suggestion is more user-friendly and does not rely on the form being named.

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
Introduction Since I wrote the original article about Handling Date and Time in PHP and MySQL several years ago, it seemed like now was a good time to update it for object-oriented PHP.  This article does that, replacing as much as possible the pr…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

597 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question