is there an attribute that i can add to all types of form input

emehrkay

03-16-2006, 08:50 PM

that will validate and i can loop through when checking required fields?

i just want to say check all of the fields in this form no matter what type and if the value is empty, do this

thanks

Kor

03-16-2006, 09:31 PM

text fields and textarea? Or you need all the form's elements to be able to pass a value onsubmit? For different types of form's elements there are different ways to validate for.

emehrkay

03-16-2006, 09:34 PM

im just checking to see if they have value.

i used the name attribute and document.getElementsByName('reqField') to loop through them.

willt he code validate if there are a bunch of elemetns with the same name?

thanks again

Kor

03-17-2006, 09:43 AM

im just checking to see if they have value.

They? I repeat my question. textfields and textarea? Or all the possible form's elements?
One more thing... to check if the value exists (as attribute) or if the value attribute has not a null value (which is not quite the same thing)?

emehrkay

03-17-2006, 01:46 PM

sorry about being so vague, long day yesterday. i realized, after i went home, that naming all of the textareas, inputs, drop downs the same would not work when its time to process the form.

i have a form with different input types: textarea, dropdowns and input boxes - all required. in the php class that i created to draw the form, i set each value to "" unless that property has a value.

so onclick of the submit button, or just button that is labeled submit, i want to run a function that will check to see if any of those fields have a value of "". i will run a function to remove leading and trailing whitespace, a lot like php trim, first then if that field is empty, change its class to one with a red border or soething that stands out and not allow for the form to be submitted.

now when it comes to walking the dom, i know that you can getelementbytagname, byname, byid - but i was wondering if i could set up some attribute like rel is to links, for each form element that i can walk through? like
<input fake="req">
<select fake="req">
then walk it like document.getelementbyfake

i hope that helps you understand what im trying to do. thanks for the help

Kor

03-17-2006, 02:21 PM

if only textfields, textarea and select elements, that it's easy, something like that:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function validate(f){
var el=f.elements;
for(var i=0;i<el.length;i++){
if((el[i].type=='text'||el[i].nodeName.toLowerCase()=='textarea'||el[i].nodeName.toLowerCase()=='select')&&(el[i].value=='')){
alert('you have not completed the form');return false
}
}
}
</script>
</head>
<body>
<form onsubmit="return validate(this)">
<input type="text" value="">
<textarea cols="" rows="" value=""></textarea>
<select>
<option value="">-- seelect --</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="submit" value="Submit">
</form>
</body>
</html>

emehrkay

03-17-2006, 02:57 PM

cool, works great. thank you!

i was unaware of the elements property

Kor

03-17-2006, 04:43 PM

wondering if i could set up some attribute like rel is to links, for each form element that i can walk through?

Now. regarding that question... Yes, you may do that. You may invent your own "fake attributes" and loop for them. DOM way could be something like (it's only a didactic style example):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function validate(f){
var alltags = document.getElementsByTagName('*')// a wild card
for(var i=0;i<alltags.length;i++){
if(alltags[i].getAttribute('foo')!=null){
alert(alltags[i].getAttribute('foo'))
}
}
return false
}
</script>
</head>
<body>
<form onsubmit="return validate(this)">
<input foo="this is the textfield" type="text" value="">
<textarea foo="this is the textarea" cols="" rows="" value=""></textarea>
<select foo="this is the select">
<option value="">-- seelect --</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="submit" value="Submit">
</form>
</body>
</html>

Kor

03-17-2006, 04:48 PM

...but most of the time you don't need it. It is enough to group/nest/isolate the desired elements and look for them by tag or position as childNodes( both of these are to be mainly used for a full dynamic code) or by name (in an afterwards second loop attempt).