Forum Moderators: open

Message Too Old, No Replies

disabling multiple select fields

         

dkin

5:47 am on Jul 27, 2005 (gmt 0)

10+ Year Member



I am using a script like this

Release Date: <select id="release" name="day" onclick="realEnable()"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select> / <select name="month" id="release" ><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option></select> / <select name="year" id="release" ><option value="1998">1998</option><option value="1999">1999</option><option value="2000">2000</option><option value="2001">2001</option><option value="2002">2002</option><option value="2003">2003</option><option value="2004">2004</option><option value="2005">2005</option><option value="2006">2006</option><option value="2007">2007</option><option value="2008">2008</option></select>

I would like to add a radio button to this and if that radio button is clicked then disable these 3 select statements.

Anyone have an idea?

dkin

10:41 pm on Jul 27, 2005 (gmt 0)

10+ Year Member



can anyone help me?

jatar_k

11:19 pm on Jul 27, 2005 (gmt 0)

WebmasterWorld Administrator 10+ Year Member



is there a disable option for drop downs? no clue my js is old and rusty

maybe if I answer then someone can go on about how wrong I am :)

can't you have an onclick event that calls a function, this function can can check the state of your radio button and disable/enable the fields accordingly?

have you tried any code dkin?

Dijkgraaf

1:10 am on Jul 28, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Something like

<html>
<head>
<title>Untitled</title>
<script type="text/Javascript">
function DisableSelect() {
document.form.Select1.disabled=true;
document.form.Select2.disabled=true;
document.form.Select3.disabled=true;
}
function EnableSelect() {
document.form.Select1.disabled=false;
document.form.Select2.disabled=false;
document.form.Select3.disabled=false;
}
</script>
</head>
<body>
Release Date:
<form name="form">
<select id="release" name="day" onclick="realEnable()" disabled>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
/
<select name="month" id="Select1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
/
<select name="year" id="Select2">
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
</select>
<input type="radio" name="rb" ID="Radio1" VALUE="Radio1" onclick="DisableSelect()">Disable
<input type="radio" name="rb" ID="Radio2" VALUE="Radio2" onclick="EnableSelect()">Enable
</form>
</body>
</html>

dkin

6:08 am on Jul 28, 2005 (gmt 0)

10+ Year Member



thank you Dijkgraaf thats exactly what I needed, I customized it to fit my needs if anyone else ever needs a code like this here it is.

<html>
<head>
<title>Untitled</title>
<script type="text/Javascript">
function DisableSelect() {
document.form.Select1.disabled=true;
document.form.Select2.disabled=true;
document.form.Select3.disabled=true;
document.form.Select4.disabled=false;
document.form.Select5.disabled=false;
}
function EnableSelect() {
document.form.Select1.disabled=false;
document.form.Select2.disabled=false;
document.form.Select3.disabled=false;
document.form.Select4.disabled=true;
document.form.Select5.disabled=true;
}

</script>
</head>
<body>

<form name="form">
Release Date:<br>
<select id="Select1" name="day">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
/
<select name="month" id="Select2">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
/
<select name="year" id="Select3">
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
</select><br>

Future Release Date: <br><select id="Select4" name="quarter"><option value="Q1">Q1</option><option value="Q2">Q2</option><option value="Q3">Q3</option><option value="Q4">Q4</option></select> / <select name="year" id="Select5"><option value="1998">1998</option><option value="1999">1999</option><option value="2000">2000</option><option value="2001">2001</option><option value="2002">2002</option><option value="2003">2003</option><option value="2004">2004</option><option value="2005">2005</option><option value="2006">2006</option><option value="2007">2007</option><option value="2008">2008</option></select>
<br>
<input type="radio" name="rb" ID="Radio1" VALUE="Radio1" onclick="DisableSelect()">Future
<input type="radio" name="rb" ID="Radio2" VALUE="Radio2" onclick="EnableSelect()">Past
</form>
</body>
</html>