...

View Full Version : required field help



finstah1
04-21-2008, 07:45 PM
I've got a form with radio buttons that when "Nonprofit/Garden Clubs $85" is checked, the Organization field is required. I can get it to work with just document.webcredit.wcsave_a12_Org.value == "" but for some reason my script never sees the org[j].value == "85" value.


<script>
function requireNumber() {

var org = document.getElementsByName("wcsave_a10_MemberAmount");

for (var j=0; j < org.length; j++) {
if(org[j].checked==true) {
alert(org[j].value);
if((org[j].value == "85") && (document.webcredit.wcsave_a12_Org.value == "")) {
alert("Organization is required.");
return false;
}
}
else
{
return true;
}
}
}
</script>




<form name="webcredit" method="POST" action="http:/.." onsubmit="return(requireNumber());">
<table id="memTable">
<tr valign="top">
<td align="left">Choose your membership category below.</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="10" onclick="reCalc()" /> Student $10</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="30" onclick="reCalc()" /> Individual $30</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="50" onclick="reCalc()" /> Family $50</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="85" onclick="reCalc()" /> Nonprofit/Garden Clubs $85</td>
</tr>
<tr valign="top">
<td align="left">Organization: <input type="text" name="wcsave_a12_Org" size="30" maxlength="80" /></td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="185" onclick="reCalc()" /> Sustaining $185</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="500" onclick="reCalc()" /> Benefactor $500</td>
</tr>
<tr valign="top">
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="1000" onclick="reCalc()" /> Director's Friend $1000</td>
</tr>
<tr valign="top">
<td>Additional Gift: $<input type="text" name="wcsave_a11_AdditionalGift" size="8" maxlength="8" value="" onblur="reCalc();" /></td>
</tr>
<tr valign="top">
<td align="right"><strong>Total:</strong> $&nbsp;<input name="Total" size="11" onfocus="this.blur()" /><input type="hidden" name="wc_amount" value='' /></td>
</tr>
</table>


Anyone have any ideas on what I'm doing wrong?

Philip M
04-21-2008, 10:02 PM
<td align="left"><input type="radio" name="wcsave_a10_MemberAmount" value="85" onclick="reCalc()" /> Nonprofit/Garden Clubs $85</td>

I don't see a function named reCalc().

var org = document.getElementsByName("wcsave_a10_MemberAmount");

The getElementsByName() method returns a collection of objects with the specified name. The name attribute really only applies to form controls, like INPUT, SELECT, BUTTON and TEXTAREA. If you want to get one specific tag, then prefer to use document.getElementById("whatever").

Here is your code corrected (no need for a for loop):-

if (org[3].checked) {
if (document.webcredit.wcsave_a12_Org.value == "") { // suggest value.length < 6 or whatever as otherwise a single space will return false. You could also use a regex to strip all leading spaces.
alert ("Organization is required.");
return false;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum