Re: [thelist] JavaScript Validation for Pull-Down Menus and Radio Buttons — R E S O L V E D
Jono
ox4dboy at comcast.net
Wed Dec 8 13:29:56 CST 2004
I have figured it out. Thank you everyone who replied. Here's the
final working code ( along with my non-JavaScript "In English"
explanation below ) incase anyone in the future is pinned in such a
situation:
<!-- The JS functions -->
<SCRIPT LANGUAGE="JavaScript"><!-- //Hide script from old browsers
//this handles the text fields
function isRequired(fieldobject, name) {
var temp = fieldobject.value;
var obj = /^(\s*)([\W\w]*)(\b\s*$)/;
if (obj.test(temp)) { temp = temp.replace(obj, '$2'); }
var obj = / +/g;
temp = temp.replace(obj, " ");
if (temp == " ") { temp = ""; }
if (temp == "") {
fieldobject.style.borderColor="#FF6666";
fieldobject.style.borderWidth="2px";
fieldobject.style.borderStyle="solid";
window.alert("The "+name+" field is required."); return false;
} else {
return true;
}
}
//this handles the drop-down menus
function isRequiredDoesNotEqual(fieldobject, doesNotEqual, name) {
var temp = fieldobject.value;
var obj = /^(\s*)([\W\w]*)(\b\s*$)/;
if (obj.test(temp)) { temp = temp.replace(obj, '$2'); }
var obj = / +/g;
temp = temp.replace(obj, " ");
if (temp == " ") { temp = ""; }
if (temp == "" || temp == doesNotEqual) {
fieldobject.style.borderColor="#FF6666";
fieldobject.style.borderWidth="2px";
fieldobject.style.borderStyle="solid";
window.alert("The "+name+" field is required."); return false;
} else {
return true;
}
}
//this handles the radio buttons
function isRequiredCheckedRadio(fieldobject, name) {
var isChecked = false;
for (i=0;i<fieldobject.length;i++) {
if (fieldobject[i].checked) {
isChecked = true;
}
}
if (fieldobject.checked) {
isChecked = true;
}
if (isChecked) {
return true;
} else {
window.alert("Please select a "+name+"."); return false;
}
}
// End hiding script from old browsers --></SCRIPT>
<!-- the form html -->
onsubmit="if(isRequiredDoesNotEqual(this.commname, 'none', 'Community
Name') &&
<form name="ServiceRequest"
onsubmit="if(isRequiredDoesNotEqual(this.commname, 'none', 'Community
Name') && isRequired(this.bldnumber,'Building Number') &&
isRequired(this.unitnumber,'Unit Number') &&
isRequired(this.firstname,'First Name') &&
isRequired(this.lastname,'Last Name') &&
isRequired(this.dayphone,'Daytime Phone') &&
isRequiredCheckedRadio(this.pets, 'if your have pets or not') &&
isRequiredCheckedRadio(this.petsconfined, 'if your pets are confined or
not') && isRequiredCheckedRadio(this.alarmoff, 'if your alarm is turned
off or not') && isRequiredCheckedRadio(this.permission, 'if you have
granted us permission to enter') &&
isRequiredDoesNotEqual(this.problem, 'none', 'Type of Problem') &&
isRequiredDoesNotEqual(this.location, 'none', 'Location of
Problem')){return true;} else {return false;}" method="post"
action="../../../../asp/test.asp">
************************************************************************
************************************************************************
****************
"I N E N G L I S H" E X P L A N A T I O N O F T H E J
A V A S C R I P T (for the drop-down menu(s))
Original code:
onsubmit="if(isRequiredDoesNotEqual(this.commname, 'none', 'Community
Name')
Original Code explained in English, piece by piece, from a non-JS
knowning perspective:
[ Step 1 ]
onsubmit= "if(...)
——> replace the "..." with the text that is after "function" and
before the first "(" in the above JavaScript — //this handles the
drop-down menus
———> so you now have, onsubmit="if(isRequiredDoesNotEqual
[ Step 2 ]
(this.commname, 'none', 'Community Name')
a. b. c.
——> a.) replace ".commname" (after "this" above) with the ID of the
pulldown menu. In this case the pulldown had id="commname"
——> b.) replace 'none', with whatever the pulldown's first option value
is. In this case the pulldown had <option value="none"
selected>Choose...</option>
——> c.) replace 'Community Name' with whatever the label for the
pull-down is. In this case the pull-down has a label of "Community
Name"
the error pop-up will tell the user "Please select a
Community Name" — where Community Name is what you use in ——>c.
When doing multiple checks, you MUST put — && — in between each new
check, so for example:
onsubmit="if(isRequiredDoesNotEqual(this.commname, 'none', 'Community
Name') && onsubmit="if(isRequiredDoesNotEqual(this.commname, 'none',
'Community Name') && ...
The last one cannot have " && " after it.
************************************************************************
************************************************************************
****************
Hopefully some one will benefit from this in the future, that is if
they are wise enough to search the archives.
More information about the thelist
mailing list