Solved

check for blank form

Posted on 2009-04-06
12
303 Views
Last Modified: 2012-05-06
Hi - I have an online employment application form that I uses CGI script to send the data to my email. I do not want a blank form to get submitted. I need some simple javascript that can check to see if all fields are empty and if so not to submit the form.  A window can pop up saying something like the form has not been completed. What is the best way to achieve this? Thank you.
0
Comment
Question by:reesecup09
  • 5
  • 3
  • 3
12 Comments
 
LVL 15

Expert Comment

by:fsze88
ID: 24083389
<form name="form1" onsubmit="return validate(this);">

<input type="text" name="text1">
<input type="text" name="text2">
<input type="submit" value="submit!">
</form>

<script type="text/javascript">
function validate(formObj){
  if (formObj.text1.value == ''){
    alert('please input value of text1');
    formObj.text1.focus();
    return false;
  }else   if (formObj.text2.value == ''){
    alert('please input value of text2');
    formObj.text2.focus();
    return false;
  }
  return true;
}

</script>
0
 

Author Comment

by:reesecup09
ID: 24083518
If I use this script will I need to check each individual field to see if all of them are empty?
0
 
LVL 15

Assisted Solution

by:fsze88
fsze88 earned 200 total points
ID: 24083569
like this?
<html>

<head><title></title></head>

<script type="text/javascript">

function validate2(formObj){

  var i=0;

  var formChilds = formObj.childNodes;

  var allBlank = true;

  for (i=0; i<formChilds.length;i++){

    if (formChilds[i].nodeName=='INPUT' && formChilds[i].type == 'text'){

      if (formChilds[i].value!=''){

        allBlank = false;

      }

    } 

  }

  

  if(allBlank){

    alert('no one field was inputted');

  }

  return (!allBlank);

}

 

</script>

</head> 

<body>

<form name="form1" onsubmit="return validate2(this);">

<input type="text" name="text1">

<input type="text" name="text2">

<input type="submit" value="submit!">

</form>

</body>

</html>

Open in new window

0
 

Author Comment

by:reesecup09
ID: 24093307
I am not good with javascript at all. I know just the basics so excuse my dumbness here, but do I just add the code to my html code as you have it or do I need to rename something. My form name is jobapp.
DO I ADD THIS BEWTEEN HEAD TAG?

<script type="text/javascript">

function validate2(formObj){

  var i=0;

  var formChilds = formObj.childNodes;

  var allBlank = true;

  for (i=0; i<formChilds.length;i++){

    if (formChilds[i].nodeName=='INPUT' && formChilds[i].type == 'text'){

      if (formChilds[i].value!=''){

        allBlank = false;

      }

    } 

  }

  

  if(allBlank){

    alert('no one field was inputted');

  }

  return (!allBlank);

}

 

</script>
 

ADD THIS TO FORM TAG?

onsubmit="return validate2(this);"

Open in new window

0
 

Author Comment

by:reesecup09
ID: 24093345
I just tried it and I get an alert when trying to submit the blank form. How many text boxes have to be filled in before the form can be submitted? Because I tried filling out two text bixes and hitting submit and I still got the alert.
0
Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

 
LVL 15

Expert Comment

by:fsze88
ID: 24093744
example of #24083518
it only alert when all of field are empty..
do I need to rename something? No, the formObj passed into function validate2
How many text boxes have to be filled in before the form can be submitted? more than zero (1,2,3,4.....)
Because I tried filling out two text bixes and hitting submit and I still got the alert. ?  I tested on ff3, ie6.. that's okey....
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 24094482
And yes, put the script in the head and modify your form tag as shown in the example. You need to scroll to see the form
0
 

Author Comment

by:reesecup09
ID: 24098435
Thanks. I get it now. But how do I fix ithe problem with alert? It should only pop up if the form is blank.
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 300 total points
ID: 24098691
It should work. I do not think it makes things easier to understand to look at childNodes - many of them could be text nodes

I suggest you take the form below and change the fieldnames and action to what you have and leave the rest alone

If it STILL does not work, we need to see exactly what you did

<html>

<head><title></title></head>

<script type="text/javascript">

function validate2(formObj){

  var elems = formObj.elements;

  for (var i=0, n=elems.length; i<n;i++){

    if (elems[i].type == 'text' && elems[i].value!=''){

        return true

    } 

  }

  alert('All fields blank, please enter at least one field');

  return false;

}

 

</script>

</head> 

<body>

<form name="form1" onsubmit="return validate2(this);">

<input type="text" name="text1">

<input type="text" name="text2">

<input type="submit" value="submit!">

</form>

</body>

</html>

Open in new window

0
 

Author Comment

by:reesecup09
ID: 24098808
The script above is not what I used. I was using the one with childNodes. It's working now. Thank you you both so much for your help and patience. I appreciate it!
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 24098913
I know you did not, I just rewrote the script for you :)
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
This article is meant to give a basic understanding of how to use R Sweave as a way to merge LaTeX and R code seamlessly into one presentable document.
Learn the basics of lists in Python. Lists, as their name suggests, are a means for ordering and storing values. : Lists are declared using brackets; for example: t = [1, 2, 3]: Lists may contain a mix of data types; for example: t = ['string', 1, T…
Learn the basics of while and for loops in Python.  while loops are used for testing while, or until, a condition is met: The structure of a while loop is as follows:     while <condition>:         do something         repeate: The break statement m…

747 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

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now