By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,988 Members | 1,049 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,988 IT Pros & Developers. It's quick & easy.

Validating TextField dependent on List/Menu value

P: n/a
Hallo NG,

I am new to JavaScript and would really appreciate any help to solve my
problem.
I am using the blow code in my form to validate form fields. What I
would like to accomplish is that if when the list/menu (attribute6)
value is "Ja" then to make the TextField Pas Nr (attribute4)
required. And if when the list/menu (attribute6) value is "Nee" to
make the TextField Pas Nr (attribute4) not required.

I have tried to adjust the code with no success. I give up and hope
that someone can help me to the right direction!

Thank you in advance,
-Platostoteles

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="41%" border="0" align="center" id="0">
<tr>
<td height="291" colspan="2" align="left" valign="top">
<!-- newsletter -->
<script language="JavaScript" type="text/javascript">
var fieldstocheck = new Array();
fieldnames = new Array();

function checkform() {
for (i=0;i<fieldstocheck.length;i++) {
if
(eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")
== "") {
alert("Vul a.u.b. het volgende verplichte veld in:
"+fieldnames[i]);

eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");
return false;
}
}

if(! compareEmail())
{
alert("De ingevulde Email adressen komen niet overeen");
return false;
}
return true;
}
function addFieldToCheck(value,name) {
fieldstocheck[fieldstocheck.length] = value;
fieldnames[fieldnames.length] = name;
}

function compareEmail()
{
return (document.subscribeform.elements["email"].value ==
document.subscribeform.elements["emailconfirm"].value);
}
</script> <form
action="http://www.whatever.com/newsletter/lists/?p=subscribe"
name="subscribeform" method="post" target="_self">
<div align="left"><font size="2" face="Verdana">
<input type="checkbox" name="list[1]" value=signup checked />
Nieuwsbrief 'Impuls' </font></div>
<div align="left" class="listdescription"> <font size="2"
face="Verdana">
<input type=hidden name="listname[1]" value="Nieuwsbrief
Impuls"/>
</font></div>
<div align="left"><font size="2" face="Verdana">
<input name="list[2]" type="checkbox" value=signup checked
/>
Aanbiedingen voor niet-leden</font></div>
<div align="left" class="listdescription">
<input type=hidden name="listname[2]" value="Aanbiedingen
voor niet-leden"/>
<br>
</div>
<table border=0>
<tr>
<td width="96"><div class="required">Email:</div></td>
<td width="260" class="attributeinput"><input type=text
name=email value="" size="40">
<script language="JavaScript" type="text/javascript">
addFieldToCheck("email","Email");
</script></td>
</tr>
<tr>
<td>Bevestig email:</td>
<td class="attributeinput"><input type=text
name=emailconfirm size="40">
<script language="JavaScript" type="text/javascript">
addFieldToCheck("emailconfirm","Bevestig email");
</script></td>
</tr>
<tr>
<td><font size="2" face="Verdana">Lid:</font></td>
<td class="attributeinput"><font size="2" face="Verdana">
<select name="attribute6" id="select2">
<option value="3">Ja</option>
<option value="4">Nee</option>
</select>
<!--0-->
<script language="JavaScript" type="text/javascript">
addFieldToCheck("attribute6","Lid");
</script>
</font></td>
</tr>
<tr>
<td><div class="required"><font size="2" face="Verdana">Pas
nr.</font></div></td>
<td class="attributeinput"><font size="2" face="Verdana">
<input name="attribute4" type="text" id="PassNr2"
size="15" maxlength="15">
<script language="JavaScript" type="text/javascript">
addFieldToCheck("attribute4","Pas nr");
</script>
</font> </td>
</tr>
<input type=hidden name="htmlemail" value="1">
</table>
<div align="left"><font size="2" face="Verdana"><br>
<input name="subscribe" type="submit" id="subscribe"
value="Aanmelden" onClick="return checkform();">
<br>
<br>
<br>
</font> </div>
</form>
<font size="2" face="Verdana">&nbsp; </font></td>
</tr>
</table>
</body>
</html>

Jan 19 '06 #1
Share this Question
Share on Google+
1 Reply


P: n/a
pl***********@gmail.com wrote:
Hallo NG,

I am new to JavaScript and would really appreciate any help to solve my
problem.
I am using the blow code in my form to validate form fields. What I
would like to accomplish is that if when the list/menu (attribute6)
value is "Ja" then to make the TextField Pas Nr (attribute4)
required. And if when the list/menu (attribute6) value is "Nee" to
make the TextField Pas Nr (attribute4) not required.

I have tried to adjust the code with no success. I give up and hope
that someone can help me to the right direction!

Thank you in advance,
-Platostoteles

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
It might be time to change to strict, given that it has been around for
6 years now.
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="41%" border="0" align="center" id="0">
When posting code, keep examples to a minimum that show the problem.
Otherwise you are posting lots of stuff that just isn't necessary.

<tr>
<td height="291" colspan="2" align="left" valign="top">
<!-- newsletter -->
<script language="JavaScript" type="text/javascript">
The language attribute is deprecated, keep type.

var fieldstocheck = new Array();
fieldnames = new Array();
I'll guess that fieldstocheck will contain the names of form elements to
check? But you haven't overcome the issue of how to put the test into
the array - there is no simple answer to that.


function checkform() {
Instead of using a submit button onclick attribute to call checkform(),
use the form onsubmit attribute. If you pass a reference to the form
from the onclick (see below), you don't have to worry about getting a
reference to the form from the function:

function checkform(form) {

for (i=0;i<fieldstocheck.length;i++) {
Variables should be kept local wherever possible, especially counters
like 'i'.

But anyhow, all you want to do is:

var t = form.attribute4[form.attribute4.selectedIndex].value;
if ('Ja' == t && "" != form.attribute6.value){
alert("Vul a.u.b. het volgende verplichte veld in Pas nr.";
if (form.attribute6.focus) form.attribute6.focus();
return false;
}
if
(eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")
== "") {
eval is almost never required and is not needed here at all. The
equivalent would be:

if (document.subscribeform.elements[fieldstocheck[i]].value == "") {

but I've changed that line anyway.
[...]
</script> <form
Add an onsubmit handler and pass a reference to the form using 'this':

onsubmit="return checkform(this);"
If checkform returns false, the form will not submit.

action="http://www.whatever.com/newsletter/lists/?p=subscribe"
name="subscribeform" method="post" target="_self">
<div align="left"><font size="2" face="Verdana">
<input type="checkbox" name="list[1]" value=signup checked />
This is HTML, so use HTML markup not faux XHTML - ditch the '/':

<input type="checkbox" name="list[1]" value="signup" checked>
You are also better off to always enclose attribute values in quotes,
even when not required.

Nieuwsbrief 'Impuls' </font></div>
<div align="left" class="listdescription"> <font size="2"
face="Verdana">


The font element is deprecated in HTML 4, use CSS instead. There is no
need to put all those divs in there, just use one div, style it
appropriately and use BR to break lines. Forms must contain a block
element, so wrap all the elements inside the form in a single div.

The above is untested, but should give you an idea of what to do.

[...]

--
Rob
Jan 20 '06 #2

This discussion thread is closed

Replies have been disabled for this discussion.