2 Replies - 5698 Views - Last Post: 27 May 2008 - 04:07 PM

#1 b1naryMan  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 27-May 08

Inline Form Validation

Posted 27 May 2008 - 02:39 PM

Ok I'm new to this Forum so be patient...

I'm trying to make an inline javascript form validation and I have the following java script:

function checkForm() {
subject_code = document.getElementById("subject_code").value;
lectures= document.getElementById("lectures").value;


if (subject_code == "") {
  hideAllErrors();
document.getElementById("codeError").style.display = "inline";
document.getElementById("subject_code").select();
document.getElementById("subject_code").focus();
  return false;
  }

else if (lectures.selectedIndex == "") {
hideAllErrors();
document.getElementById("lectError").style.display = "inline";
lectures.focus;

  return false;
  }
  
  return true;
  }
  
  function hideAllErrors() {
	document.getElementById("codeError").style.display = "none"
	document.getElementById("lectError").style.display = "none"
	
  }


and I have also this:
<form onsubmit="return checkForm(this);" name="addForm" action="success.jsp" method="post" >
<input type="text" name="subject_code" id="subject_code" value="" size=55 maxlength=10/>
 <div class=error id=codeError>Required: Please enter your Subject Code</div>

<select name="lectures" id="lectures">
								<option value="" selected="selected"></option>
								<option value="1">1</option>
								<option value="2">2</option>
								<option value="3">3</option>
								<option value="4">4</option>
							</select>
							<div class=error id=lectError>Required: Please select Number of Lectures</div>
 <input type="submit" value="Save"/>



Now my problem is that when I don't choose from the list box is display me the error for 1 second and immediately the form is submitted and it shouldn't be. The text box error works fine...

Thanks

Is This A Good Question/Topic? 0
  • +

Replies To: Inline Form Validation

#2 Martyr2  Icon User is offline

  • Programming Theoretician
  • member icon

Reputation: 4307
  • View blog
  • Posts: 12,085
  • Joined: 18-April 07

Re: Inline Form Validation

Posted 27 May 2008 - 03:33 PM

Well remember you are getting the value of the control, so you can't use lectures.selectedIndex on the value. So here are some modifications to your javascript as well as a few minor ones to your form.

function checkForm() {
	subject_code = document.getElementById("subject_code").value;
	lectures= document.getElementById("lectures");


	if (subject_code == "") {
  		hideAllErrors();
		document.getElementById("codeError").style.display = "inline";
		document.getElementById("subject_code").select();
		document.getElementById("subject_code").focus();

  		return false;
  	}

	else if (lectures.selectedIndex == 0) {
		hideAllErrors();
		document.getElementById("lectError").style.display = "inline";
		lectures.focus;

  		return false;
  	}
  
  	return true;
}
  
function hideAllErrors() {
    document.getElementById("codeError").style.display = "none"
    document.getElementById("lectError").style.display = "none"
    
}



And your form...

<form onsubmit="return checkForm()" name="addForm" action="success.jsp" method="post" >



Hope this works out for you!

"At DIC we be form evaluating and validation code ninjas... we evaluated you and came to the conclusion.... NO SOUP FOR YOU!" :snap:

This post has been edited by Martyr2: 27 May 2008 - 03:34 PM

Was This Post Helpful? 1

#3 b1naryMan  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 27-May 08

Re: Inline Form Validation

Posted 27 May 2008 - 04:07 PM

It works!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
It was very helpful.Thanks a lot.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1