help with JS form validation - HTML Forums

Reiss · 10-27-2009, 04:10 AM

Hi,
Bit of a JavaScript noob and I'm trying to figure out how I can validate a text area based on the results of a select menu.
I have a page with several selects and text area's. The selects are simple Yes/No, if No is selected, the text area below can be empty, but if Yes is selected the text area below it has to filled in.
For now, I've been using PHP to provide an error message if 'Yes' was selected and the appropriate text area was not filled in once the form has been submitted, but I need to do it before the form is submitted.
Does anyone have any basic JS functions that I could use to do this?
many thanks

nickbfromct · 10-29-2009, 01:04 PM

hey, post some code and i could help some more but....for now I can tell you to use the onblur event. this way when soemone selects yes without having the textbox filled out and they try to go to another question/option they can get an error message. example: <select onblur="function()"> then the javascript would be:

Code:

 if(formName.textBoxName.value == "" && formName.selectName.value == "yes")
{
     document.getElementById('textBoxID').value = "PLEASE FILL ME OUT";
}

This might point you in the right direction. MAYBE!

nickbfromct · 10-29-2009, 01:05 PM

also, w3schools is awesome fore javascript help www.w3schools.com

Reiss · 10-29-2009, 07:16 PM

Thanks nick,
Going to give a try tomorrow, looks so much like PHP that I already know, I really should do some reading up on JavaScript.
I need the form to not submit if there is this error, so I guess I need to add return false to the function.
thanks again, will post my results.

prasanthmj · 10-30-2009, 12:20 AM

Try this JavaScript form validation script. It is easy to add validations using this script.

Reiss · 10-30-2009, 04:05 AM

Tried adding the code to my form but get an Object expected error.
Added the following function to an external javascript file:

Code:

function info_required(){
	 if(consent_form.med_condition_details.value == "" && consent_form.med_conditions.value == "Yes")
{
     document.getElementById('med_condition_details').value = "Please provide details";
	 return false;
}
}

My html form :

HTML Code:

<form action="../ts-03_success.php" method="POST" name="consent_form" id="consent_form">
 <select name="med_conditions" id="med_conditions" onblur="info_required()">
<option value="select" selected="selected">Select</option>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
  </select>
 <textarea name="med_condition_details" id="med_condition_details" cols="45" rows="5" class="textArea600 boldText"><?php  echo $row_ts03['med_condition_details'];  ?></textarea>

any idea what I've done wrong?

I also need to make the function more flexible, as I will want to use the same function 6 times on the same form.
thanks guys

Reiss · 11-03-2009, 04:17 AM

can anyone help?
thanks