/    Sign up×
Community /Pin to ProfileBookmark

JS help required

Copy linkTweet thisAlerts:
Jul 14.2004

Hi guys,

Here is a code snippet. What I want to do is, when user selects [i]Yes[/i] radio-button, the drop-down list [the one [i]highlighted[/i]] becomes [i]disable[/i] automatically. Kindly tell me how to do this.

Bye,
Viki [newbie of JS world]

[code]
 <td width=”25%” valign=”top” bgcolor=”FFCC00″ height=”12″><font face=”Arial” size=”3″>Last school attended?</font></td>
<td width=”25%” valign=”top” height=”12″><font face=”Arial” size=”3″>Yes <input type=”radio” value=”Yes” name=”Attended_BSK_Before”>
No <input type=”radio” value=”No” checked name=”Attended_A_Before”></font></td>
<td width=”25%” valign=”top” bgcolor=”FFCC00″ height=”12″ colspan=”2″><font face=”Arial” size=”3″>If
‘YES’, in which year?</font></td>
<td width=”25%” valign=”top” height=”12″><font face=”Arial” size=”2″><strong><select name=”Attended_a_Before_if_YES_When” size=”1″>

[b]<option value=”NEW” selected>Not Attended</option>[/b]
<option value=”2004″>2004</option>
<option value=”2003″>2003</option>
<option value=”2002″>2002</option>
<option value=”2001″>2001</option>
<option value=”2000″>2000</option>
<option value=”1999″>1999</option>
<option value=”1998″>1998</option>
<option value=”1997″>1997</option>
<option value=”1996″>1996</option>
<option value=”1995″>1995</option>
<option value=”1994″>1994</option>
<option value=”1993″>1993</option>
<option value=”1992″>1992</option>
<option value=”1991″>1991</option>

</select></strong></font></td>
</tr>
[/code]

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@PittimannJul 14.2004 — Hi!

Why don't you leave out this option:

<option value="NEW" selected>Not Attended</option>

and display the entire select, if "Yes" is checked - hide it if "No" is checked?

Disabling options does not work for IE...

Cheers - Pit
Copy linkTweet thisAlerts:
@VikiauthorJul 15.2004 — Hi,

Ok I got you [as far as I thinks]. It needs me to write JS functions of if-else logic. Well, I am complete niewbie of JS and therefore did not know the exact syntax. Here is a pseudo code,

<i>
</i> if (checked == 'Yes' ){
Display drop-down list
}
else{
Hide drop-down list.
} <br/>

Can anyone help me in geting exact syntax for this purpose?

Bye,

Viki (one of the JS newbie)
Copy linkTweet thisAlerts:
@PittimannJul 15.2004 — Hi!

A little example:[code=php]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
var dom=(document.getElementById);
var selSpan;
function init(){
if(dom){
selSpan=document.getElementById('sel');
selSpan.style.visibility='hidden';
}
}
//-->
</script>
</head>
<body onload="init()">
<form><span style="font-family:arial,verdana;font-size:12pt">Last school attended?&nbsp;&nbsp;&nbsp;Yes&nbsp;<input type="radio" value="Yes" name="Attended_BSK_Before" onclick="if(this.checked&&dom)selSpan.style.visibility='visible';this.form.Attended_A_Before.checked=false;">&nbsp;&nbsp;
No&nbsp;<input type="radio" value="No" checked name="Attended_A_Before" onclick="if(this.checked&&dom)selSpan.style.visibility='hidden';this.form.Attended_BSK_Before.checked=false;">
</span>
<span id="sel" style="font-family:arial,verdana;font-size:12pt">
<noscript>If 'Yes', in which year?</noscript>
<script language="JavaScript" type="text/javascript">
if(!dom)document.write("If 'Yes', in which year?");
else document.write("In which year?");document.close();
</script>
<select name="Attended_a_Before_if_YES_When" size="1">
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
</select></span>
</form>
</body>
</html>[/code]It leaves the functionality intact if js is disabled, but you should really think over putting the two radio buttons in one group by assigning the same names to them. You could assign different values to distinguish them.

The way you handle this, the user could check both if js is disabled and that does not make much sense.

Cheers - Pit
×

Success!

Help @Viki spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.2,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...