Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Javascript Validating Hidden Fields

Status
Not open for further replies.

tfhwargt3

Programmer
Sep 19, 2006
61
US
I am building a form for my business that has a lot of hidden fields.

Since I am hiding and showing fields due to different selections the users make, I want to validate only visible forms fields.

Here is my small form on a website.
I don't have the validation script up there currently because the javascript I have requires me to enter in all the fields that are required and then will 'validate' those by checking if they are null or "". But I can't know which ones will be shown to the users so I have to enter all the fields as required. This isn't good because the users won't know why the fields they can't see are required.

I also found this thread [thread216-1481039] where someone was asking the same question but it must have died before it was answered.

Here's some of js I currently have checking for validation. Again all I really want is to validate visible fields:

Code:
function formCheck(formobj){
	var fieldRequired = Array("issue_type", "part_num", "order_num");
	var fieldDescription = Array("issue_type", "part_num", "order_num");
	var alertMsg = "Please complete the following fields:\n";
	for (var i = 0; i < fieldRequired.length; i++){
		var obj = formobj.elements[fieldRequired[i]];
		if (obj){
			switch(obj.type){
                ...........case statements checking for null or ""......
        if (alertMsg.length == l_Msg){
		return true;
	}else{
		alert(alertMsg);
		return false;
	}         
}
 
I have been searching the web about this. It seems most people want to validate hidden fields instead of not validating the hidden fields.

I am thinking I might just create separate forms for each branch in the form. That way I can have separate submit buttons, and then use the different names for the submit-buttons to call different pieces of the javascript functions.

I know this sounds like terrible design, but it seems like a quick fix...

I am still very interested in validating only what is shown on the page with only one submit button.
 
If you are toggling the display of the hidden fields on and off using the DOM, could you run a conditional so that the fieldRequired array is only populated with inputs that are on display where when the check is run?

Maybe only look at those where
document.getElementById("field_name").style.display !="none"
 
Thank you BigRed1212. I used your idea to help me design my show/hide fields much better. Now I show and hide by <div> tags.

But I am stuck here again at validating. Because I show/hid by <div> tags using an integer and a loop, I am having trouble validating fields within the <div> tags.

If I had a way to loop through fields in my <div> tags I could easily loop through and validate each one that was visible in that <div> because I could do what BigRed suggested on non-hidden <div>'s. I am not really used to linking up javascript and html as you can probably see, but I think I am getting there. I have written a validate function:

Code:
function validate_required(field) {
	with (field) {
	     if (value==null||value=="") {
	          field.style.background = 'Yellow';
	     } else {
		  field.style.background = 'Green'
	     }
         }
}

And I want to call this with an onChange so I can only run javascript on fields that are shown, not hidden. The code should make neglected fields yellow when they are left without input, and green when they have text.

Here's what I am doing:

Code:
<div id='Issue1' name="Exchange" style="display: none;"> <br>
<b>Exchange Information:</b><br>
Order #:<input type="text" id="order_num" name="[Exchange] Order #:" [red]onChange="javascript: validate_required(document.getElementById('order_num'));"[/red]><br>

Can someone take a look at my code on my site:
And tell me what I am doing wrong I know I am close...
 
And I understand I could accomplish this the same way using naming conventions and add numbers to the end, but I only want to do this once for each field after I leave the field, not every time I leave every field for every single field in the form. I hope that sentence makes sense...

Sorry for not specifying that in the first place.
 
I don't understand why you can't know which fields are visible. You should be able to determine that with code.

Why not give a default value to fields that are hidden from the user and this should take care of the "required fields" business". Handle the default values in the validation.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top