How do you make HTML Form text boxes required?

Discussion in 'OT Technology' started by Mr Bad Guy, May 10, 2004.

  1. Mr Bad Guy

    Mr Bad Guy Guest

    I'd just like to start by saying this isn't a homework assignment. I'm building a webpage for this business my brother and I are starting. I have a part of the website where people can submit a request. My PHP script works, but the problem is, people can submit a blank request, which in turn gets emailed to us all blank. So I want to make it so that their email address is required, but I can't figure out how. Below is the FORM section of my HTML. If anyone can help, i'd seriously appreciate it. I'm sure it's something very easy, but i've been searching for two days on the internet, and nothing I'm finding seems to work. Thanks!!!!

    <form action="parts_request.php" method="post">
    <h3>Submit a parts request</h3>
    Year:<br>
    <input type="text" name="year" size="20">
    <br>
    Part:<br>
    <input type="text" name="part" size="20">
    <br>
    Description:
    <br>
    <textarea name="description" rows="5" cols="64"></textarea>
    <br>
    Your Email:
    <br>
    <input type="text" name="email" size="25">
    <br><br>
    <input type="submit" value="Send">
    <input type="reset" value="Reset">
    </form>

    Yea I know it's not the best, like the year field shouldn't be allowed to have 20 characters, i'm working on the small things. Email address being required is one of them. Thanks again.
     
  2. èpic

    èpic aka modernlife

    Joined:
    Oct 20, 2003
    Messages:
    15,388
    Likes Received:
    0
    Location:
    australia
    check if the feilds are blank in your php before you send the email? or use just javascript :/
     
  3. èpic

    èpic aka modernlife

    Joined:
    Oct 20, 2003
    Messages:
    15,388
    Likes Received:
    0
    Location:
    australia
    ill code ur whole site for 45$ :squint: :x:
     
  4. Mr Bad Guy

    Mr Bad Guy Guest

    haha yea right. it's already coded, just working out the small things.
     
  5. choler

    choler New Member

    Joined:
    May 21, 2002
    Messages:
    183
    Likes Received:
    0
    form validation is not "small things" :slap:
     
  6. Slid.

    Slid. I'm a guy.

    Joined:
    Oct 25, 2001
    Messages:
    1,928
    Likes Received:
    0
    Location:
    NH
    For this to work you'd need to assign a name to your form - I use tform. Obviously rename all the fields to your respective fields. Then also in your form tag you want an onSubmit trigger like so:

    <form name="tform" ACTION="/catalog_request.php" method="post" onsubmit="return ValidateForm()">

    <script language="Javascript">

    function IsEmpty(aTextField) {
    if ((aTextField.value.length==0) ||
    (aTextField.value==null)) {
    return true;
    }
    else { return false; }
    }

    function ValidateForm()
    {

    var tname=document.tform.name
    var taddress1=document.tform.address1
    var tcity=document.tform.city
    var tstate=document.tform.state
    var tzipcode=document.tform.zipcode

    if(IsEmpty(tname))
    {
    alert('You must enter your Name.')
    tform.name.focus()
    return false
    }

    if(IsEmpty(taddress1))
    {
    alert('You must provide your street address.')
    tform.address1.focus()
    return false
    }

    if(IsEmpty(tcity))
    {
    alert('You must provide your city.')
    tform.city.focus()
    return false
    }

    if(IsEmpty(tzipcode))
    {
    alert('You must provide your zipcode.')
    tform.zipcode.focus()
    return false
    }

    return true

    }

    </script>
     
  7. Slid.

    Slid. I'm a guy.

    Joined:
    Oct 25, 2001
    Messages:
    1,928
    Likes Received:
    0
    Location:
    NH
    Bah, had a minute so I did it for you ;)

    Paste into <head> tags </head>

    Code:
    
    		<script language="Javascript">
    		
    		function IsEmpty(aTextField) {
    		   if ((aTextField.value.length==0) ||
    		   (aTextField.value==null)) {
    		      return true;
    		   }
    		   else { return false; }
    		}	
    		
    		function ValidateForm()
    		{
    		
    		   var tyear=document.tform.year
    		   var tpart=document.tform.part
    		   var tdescription=document.tform.description
    		   var temail=document.tform.email
    			
    		   if(IsEmpty(tyear)) 
    		   { 
    		      alert('You must enter the year.') 
    		      tform.year.focus()
    		      return false
    		   } 
    		
    		   if(IsEmpty(tpart)) 
    		   { 
    		      alert('You must enter the part.') 
    		      tform.part.focus()
    		      return false
    		   } 
    		
    		   if(IsEmpty(tdescription)) 
    		   { 
    		      alert('You must enter a description.') 
    		      tform.description.focus()
    		      return false
    		   } 
    		
    		   if(IsEmpty(temail)) 
    		   { 
    		      alert('You must enter your email address.') 
    		      tform.email.focus()
    		      return false
    		   } 
    		
    		return true
    		
    		} 
    		
    		</script>
    
    
    Change your form to:

    Code:
     
    
    <form name="tform" action="parts_request.php" method="post" onsubmit="return ValidateForm()">
    <h3>Submit a parts request</h3>
    Year:<br>
    <input type="text" name="year" size="20">
    <br>
    Part:<br>
    <input type="text" name="part" size="20">
    <br>
    Description:
    <br>
    <textarea name="description" rows="5" cols="64"></textarea>
    <br>
    Your Email:
    <br>
    <input type="text" name="email" size="25">
    <br><br>
    <input type="submit" value="Send">
    <input type="reset" value="Reset">
    </form>
    
    
     
  8. Mr Bad Guy

    Mr Bad Guy Guest

    wow, thanks for the help guys. I'm going to mess with this first thing in the morning.
     

Share This Page