Solved

Drop down & Radio buttons

Posted on 2003-11-25
6
734 Views
Last Modified: 2010-04-09
Hi,
     I am a small problem in HTML.
     I am a radio button & when one checks that button, he is supposed to enter some data from 3 drop down boxes & then proceed.
     But my requirement is such that unless that radio button is checked, the dropdown box is inactive, meaning the no data in the drop down can be viewed or selected. Only when the radio buttons r selected are the drop down data available for viewing & selection.
     Can anyone suggest a way out !
0
Comment
Question by:medebayan
  • 3
  • 2
6 Comments
 
LVL 8

Expert Comment

by:xabi
ID: 9823128
What about this?

<html>
<head>
<title>Sample</title>
</head>
<body>
<form name="myform">
<input type="checkbox" name="mycheck" onclick="this.form.myselect.disabled=!this.checked"><br>
<select name="myselect" disabled>
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
</form>
</body>
</html>

xabi
0
 

Author Comment

by:medebayan
ID: 9823211
I don't think this will solve my problem.
Firstly, there r 2 RADIO BUTTONS. One when selected needs inputs from drop downs, which are populated from the database.
Now, mayb u can provide me with an accurate solution !
0
 
LVL 7

Expert Comment

by:gam3r_3xtr3m3
ID: 9823613
dynamically, here's a solution:

<script language="JavaScript" type="text/javascript">
function enableSelect(){
if(document.theform.selectbox.disabled=true){
document.theform.selectbox.disabled=false;}}
</script>
<body>
<form name="theform">
<input type="radio" onClick="enableSelect();" name="radio1" value="Selection #2">Selection #1<br />
<input type="radio" onClick="enableSelect();" name="radio1" value="Selection #2">Selection #2<br />
<select name="selectbox" disabled="disabled">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
</body>
0
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 
LVL 7

Accepted Solution

by:
gam3r_3xtr3m3 earned 70 total points
ID: 9823676
OR if your doing a confirmation dynamically like this...:

<html>
<head>
<title>2 radio buttons and a checkbox!</title>
<script language="JavaScript" type="text/javascript">
function checkStat(){
if(document.theform.radio1.checked="undefined"){
alert("Please select a choice!"); return false;}}
function enableSelect(){
if(document.theform.selectbox.disabled=true){
document.theform.selectbox.disabled=false;}
if(document.theform.sbmtbtn.disabled=true){
document.theform.sbmtbtn.disabled=false;}}
function disableSelect(){document.theform.selectbox.disabled=true;}
</script>
</head>
<body>
<div align="center">
<form name="theform" onSubmit="return checkStat();">
<input type="radio" onClick="enableSelect();" name="radio1" value="y" />Add to Database<br />
<input type="radio" onClick="disableSelect();" name="radio1" value="n" />Don't do anything<br />
<select name="selectbox" disabled="disabled">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
<br /><input type="submit" name="sbmtbtn" value="submit" disabled="disabled" />
</div>
</body>
</html>
0
 
LVL 7

Expert Comment

by:gam3r_3xtr3m3
ID: 9823710
lol... i got the title wrong, the coding wrong and i forgot to take of my test checkStat(); function. Too much VB for me. lol... here's mabye a set of all you need:

<html>
<head>
<title>2 radio buttons and a option box!</title>
<script language="JavaScript" type="text/javascript">
var cont1=null;
function loadStat(){
if(document.theform.radio1.selected==true){enableSelect();}}
function checkStat(){
if(cont1=="y"){
alert("Select a database!");return false;}}
function enableSelect(){
cont1="y";
if(document.theform.selectbox.disabled==true){
document.theform.selectbox.disabled=false;}
if(document.theform.sbmtbtn.disabled==true){
document.theform.sbmtbtn.disabled=false;}}
function disableSelect(){
cont1="n";
if(document.theform.selectbox.disabled==false){
document.theform.selectbox.disabled=true;}
if(document.theform.sbmtbtn.disabled==true){
document.theform.sbmtbtn.disabled=false;}}
</script>
</head>
<body onLoad="loadStat();">
<div align="center">
<form name="theform" onSubmit="return checkStat();">
<input type="radio" onClick="enableSelect();" name="radio1" value="y" />Add to Database<br />
<input type="radio" onClick="disableSelect();" name="radio1" value="n" />Don't do anything<br />
<select name="selectbox" disabled="disabled">
<option>Please select one...</option>
<option value="db1">database 1</option>
<option value="db2">database 2</option>
<option value="db3">database 3</option>
</select>
<br /><input type="submit" name="sbmtbtn" value="Submit" disabled="disabled" />
</div>
</body>
</html>
0
 

Author Comment

by:medebayan
ID: 9823763
Thanx a lot ! This should serve my need..
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Introduction The Google Maps API offers various ways to draw dynamic and static maps.  Using a combination of PHP and JavaScript, you can draw active JavaScript maps that allow pan-and-zoom in the client browser window.  You can also draw "static" …
Things That Drive Us Nuts Have you noticed the use of the reCaptcha feature at EE and other web sites?  It wants you to read and retype something that looks like this.Insanity!  It's not EE's fault - that's just the way reCaptcha works.  But it is …
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

743 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now