JavaScript - Group radio button and drop down box on a form

Asked By Kay Kay
17-Sep-05 11:56 PM
I want to create a form where a user select 1 item from about 10 radio buttons. Beside each radio button is a drop down box with pre-defined boxes. That's not the problem. 
How do I disble drop down boxes if the radio button is not selected? Thanks.

do this  do this

18-Sep-05 05:23 AM
<html>
<head>
<script type="text/javascript">
function makeDisable()
{
var x=document.getElementById("mySelect")
x.disabled=true
}
function makeEnable()
{
var x=document.getElementById("mySelect")
x.disabled=false
}
</script>
</head>

<body>
<form>
<select id="mySelect">
	<option>Apple</option>
	<option>Banana</option>
	<option>Orange</option>
</select>
<input type="radio" onclick="makeDisable()" value="Disable list">Diable<br/>
<input type="radio" onclick="makeEnable()" value="Enable list">Enable
</form>
</body>

</html>

Do like this  Do like this

18-Sep-05 08:51 AM
You can do something like this way:

first time when the page will be loaded, no radio button will be selected, so you can make dropdown's disabled by default.
and onclick event of radiobutton you can make them enabled.
Let your radio buttons have id's like rdo1,rdo2 etc..and dropdowns like ddl1,ddl2 etc..

<input id="rdo1" name="rdo" type="radio" onClick="javascript:onChange();">
<input id="rdo2" name="rdo" type="radio" onClick="javascript:onChange();">

function onChange()
{
for(i=0;i<10;i++)
{
if(eval("document.getElementById(" + ".rdo" + i + ")").checked==true)
{
eval("document.form1"+ ".ddl" + i).disabled=false;
}
}
}

will try this  will try this

18-Sep-05 09:07 AM
Thanks. I will try this. Noticed there is no drop down in your script.
I tried  I tried
18-Sep-05 09:09 AM
Thanks. This helps. Just a quick question...when a radio button is selected, the selection does not show, but this only enables the dropdown.
Example : Try this out  Example : Try this out
20-Sep-05 05:01 AM
Try this out


Select an Option
<form name=form1>
Flowers<input name="radio1" type="radio" onClick="javascript:CheckMe('0','1');">
<select name=select1 disabled>
  <option value="Rose">Rose</option>
  <option value="Lily">Lily</option>
</select>
</br>
Colours<input name="radio1" type="radio" onClick="javascript:CheckMe('1','2');"> 
<select name=select2 disabled>
  <option value="Red">Red</option>
  <option value="Green">Green</option>
</select>
</br>
Sport<input name="radio1" type="radio" onClick="javascript:CheckMe('2','3');"> 
<select name=select3 disabled>
  <option value="Tennis">Tennis</option>
  <option value="Cricket">Cricket</option>
</select>
</br>
</form>
<script language="javascript">

function CheckMe(radName,selName) 
{ 
var i=0;
for(i=0;i<3;i++)
{
	if (eval("document.form1.radio1["+i+"].checked")==eval("document.form1.radio1["+radName+"].checked")) 
	{
		eval("document.form1.select"+selName).disabled=false;
	}
	else
	{
		eval("document.form1.select"+(i+1)).disabled=true;
	}
}
}

</script>
Perfect!  Perfect!
20-Sep-05 09:30 AM
This is exactly what I want! Thanks.
Create New Account
help
call JavaScript function from asp C++ / VB I am using Access database, ASP, and some Javascript. A Group of two radio buttons. Button "noshow" updates a record and calls a javascript function. The javascript function puts a value in a hiddenfield. Button "show" updates the same record and places a different value in the same hiddenfield without using the javascript function. value = "<!- -" <% If Recordset2("image_code_A") = "<!- -" Then %> checked noshow< / label> Recordset2("image_code_A") = "" Then %> checked <% End if %> onclick = "document.getElementById('hiddenFieldNo').value = " value = """ / > show< / label> javascript function: function doItA(obj){ obj.form.elements['hiddenFieldNo'].value = "- -> "; } When either button is clicked and
Radio Buttons Text Hi, Here i am using DevExpress tools in my windows application, so i want to make multi line text for a radio group item which is placed over layout control? Please explain me with a brief example Try your previous thread. Here it follows: http: / / www.eggheadcafe.com / community / csharp / 2 / 10415447 / changing-radio-buttons-text.aspx hi Dont post similar questions.You can find answer in your previous thread. Here it follows: http: / / www.eggheadcafe.com / community / csharp / 2 / 10415447 / changing-radio-buttons-text.aspx hi here is an example of radiobutton silverlight <RadioButton Width = "100" > <RadioButton title > < / title > < style type = "text / css" > .radioClass { word-wrap: break-word; } < / style > < script type = "text / javascript" src = " http: / / code.jquery.com / jquery-1.4.1.js " > < / script > < script type = "text / javascript" > $(document).ready(function () { $('#radiobtn1 label[for* = radiobtn1]').css("word-wrap", "break-word"); }); < / script > < / head > < body value set at zero (0). " / > < / asp:RadioButtonList > < / div > < / form > < / body > < / html > Create New Account keywords: Radio, Buttons, Text description: Hi, Here i am using DevExpress tools in my windows application, so
How to dynamically get value from Radio Group Hi, I have to radio button in a radio group, and belwo the radio buttons i have one textbox and beside that button for browsing the file, Depending the selection of radio button i need to enable browing, i, e when i click the browse button i need to pass the value of the select radio button from the group, i tried like in the onclik event of browse button.but
Radio button list - java script In radio button list how to pass the selected value to the java script The following javascript will help us to do that. < script language = "javascript" type = "text / javascript"> function GetRDBValue() { var radio = document.getElementsByName( 'rdbGender' ); for ( var i = 0; i radio.length; i++) { if (radio[i].checked) { alert(radio[i].value); } } } < / script > HI PLEASE CHECK THIS CODE SNIPPET function getCheckedRadio