Script wont work in IE

Discussion in 'JavaScript' started by zed420, Oct 1, 2008.

0
  1. #1
    Hi All

    I wonder if someone can help me I have a strange problem, this JavaScript below works wonders in Firefox but in IE I'm able to hide dateDay,dateMO and DateYr BUT NOT timeHr and timeMin why why and why ? All these are from the same form, all are dropdown boxes.

    <script language="javascript">
    function enableField()
    {
    document.ebooking.dateDay.disabled=false;
    document.ebooking.dateMO.disabled=false;
    document.ebooking.dateYr.disabled=false;
    document.ebooking.timeHr.disabled=false;
    document.ebooking.timeMin.disabled=false;
    }
    function disableField()
    {
    document.ebooking.dateDay.disabled=true;
    document.ebooking.dateMO.disabled=true;
    document.ebooking.dateYr.disabled=true;
    document.ebooking.timeHr.disabled=true;
    document.ebooking.timeMin.disabled=true;
    }
    </script>

    These are my controls;

    <table width="60%" border="0" cellspacing="3" cellpadding="3">
    <tr>
    <td>
    <input type="radio" name="radio" id="asap" value="asap" checked="checked" onclick="disableField()"/>
    </td>
    <td>As Soon As Possible</td></tr>
    <tr><td>
    <input type="radio" name="radio" id="st" value="st" onclick="enableField()" /></td>
    <td>Specific Time</td>
    </tr>
    </table>

    and this the form that doesn't work.

    <table>
    <tr><td>
    &nbsp; &nbsp;

    Hr <select name='timeHr' disabled="true" >
    <option>00</option>
    <option>01</option>
    ...
    </select>
    &nbsp; &nbsp;
    Min <select name="timeMin" disabled="disabled">
    <option>00</option>
    <option>30</option>
    ...
    </select></td></tr></table>

    Thanks in advance
    Zed
     
    zed420, Oct 1, 2008 IP
  2. jgarrison

    jgarrison Peon

    Messages:
    66
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Min <select name="timeMin" disabled="disabled"> should be
    Min <select name="timeMin" disabled="true">

    And try using: document.getElementById(id); to reference the controls.

    So document.ebooking.dateDay.disabled=false; would become

    var dayControl = document.getElementById("dateDay");
    dayControl.enabled = false;

    Of course the above is an example the would have to be made for all the enableField and disableField statements.

    -Jim
     
    jgarrison, Oct 5, 2008 IP
  3. jgarrison

    jgarrison Peon

    Messages:
    66
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Here's the script block:

    <script language="javascript">
    function enableField()
    {
    var dayControl = document.getElementById("dateDay");
    var monthControl = document.getElementById("dateMO");
    var yearControl = document.getElementById("dateYr");
    var hourControl = document.getElementById("timeHr");
    var minuteControl = document.getElementById("timeMin");
    dayControl.enabled = false;
    monthControl.enabled = false;
    yearControl.enabled = false;
    hourControl.enabled = false;
    minuteControl.enabled = false;
    }
    function disableField()
    {
    var dayControl = document.getElementById("dateDay");
    var monthControl = document.getElementById("dateMO");
    var yearControl = document.getElementById("dateYr");
    var hourControl = document.getElementById("timeHr");
    var minuteControl = document.getElementById("timeMin");
    dayControl.enabled = true;
    monthControl.enabled = true;
    yearControl.enabled = true;
    hourControl.enabled = true;
    minuteControl.enabled = true;
    }
    </script>
     
    jgarrison, Oct 5, 2008 IP
  4. dimitar christoff

    dimitar christoff Active Member

    Messages:
    882
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    90
    #4
    sorry, mate... can't you just post the whole document or a link to it? nobody will waste time trying to compile bits together.

    wrong, depends on his doctype, if xhtml then disabled="disabled" is correct.

    he has no id assigned to time dropdowns:
    Hr <select name='timeHr' disabled="true" >
<option>00</option>
<option>01</option>
...
</select>
&nbsp; &nbsp;
Min <select name="timeMin" disabled="disabled">
<option>00</option>
<option>30</option>
...
</select></td></tr></table>
    HTML:
    hence, can't reference with document.getElementById
     
    dimitar christoff, Oct 6, 2008 IP
  5. jgarrison

    jgarrison Peon

    Messages:
    66
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks Dimitar. I should of looked at the code closer.

    Here is a complete working example, tested in IE and Firefox:

    <html>
    <head>
    <title></title>
    <script language="javascript">
    function toggleFields(onOff) {
    if(onOff == 'asap') {
    // document.ebooking.dateDay.disabled=false;
    // document.ebooking.dateMO.disabled=false;
    // document.ebooking.dateYr.disabled=false;
    document.ebooking.timeHr.disabled=true;
    document.ebooking.timeMin.disabled=true;
    }
    if(onOff == 'st') {
    // document.ebooking.dateDay.disabled=true;
    // document.ebooking.dateMO.disabled=true;
    // document.ebooking.dateYr.disabled=true;
    document.ebooking.timeHr.disabled=false;
    document.ebooking.timeMin.disabled=false;
    }
    }
    </script>
    </head>
    <body>
    <form name="ebooking">
    <table width="60%" border="0" cellspacing="3" cellpadding="3">
    <tr>
    <td><input type="radio" name="radio" id="asap" value="asap" onclick="toggleFields(this.value);"/>
    </td>
    <td>As Soon As Possible</td>
    </tr>
    <tr>
    <td><input type="radio" name="radio" id="st" value="st" onclick="toggleFields(this.value);" />
    </td>
    <td>Specific Time</td>
    </tr>
    <tr>
    <td colspan="2">&nbsp;&nbsp;Hr
    <select name='timeHr' disabled="true" >
    <option>00</option>
    <option>01</option>
    </select>
    &nbsp;&nbsp;Min
    <select name="timeMin" disabled="true">
    <option>00</option>
    <option>30</option>
    </select>
    </td>
    </tr>
    </table>
    </form>
    </body>
    </html>
     
    jgarrison, Oct 6, 2008 IP