Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Apr 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Disable Dropdown w/ Another OnChange

    I have 2 drop downs and I want one (endtime) to disable when I select a value (All Day) in another (starttime). Seems easy but it's giving me fits. My question is less "How can I do this by copy/paste code" but more "Why is my code not working?" I feel like this will give me a better understanding of where things went wrong so next time I can find the problem. Obviously I'm a JQuery newb. Any help would be great.

    JQuery:

    Code:
    <script>
      var update_endtime = function () {
        if ($("#starttime").val() === "All Day") {
            $('#endtime').attr('disabled', 'disabled');
        }
        else {
            $('#endtime').removeAttr('disabled');
        }
      };
      $(update_endtime);
      $("#starttime").change(update_endtime);
    </script>
    Html (shortened):
    Code:
    <html>
    <select id='starttime' name='starttime'">
    <option value='All Day'>All Day</option>
    <option value='0700'>7:00am</option>
    <option value='0730'>7:30am</option>
    <option value='0800'>8:00am</option>
    </select>
    <select id='endtime' name='endtime'">
    <option value='All Day'>All Day</option>
    <option value='0700'>7:00am</option>
    <option value='0730'>7:30am</option>
    <option value='0800'>8:00am</option>
    </select>
    </html>

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,969
    Thanks
    56
    Thanked 557 Times in 554 Posts
    assuming that this is trying to call a function:
    Code:
    $(update_endtime);
    you would be better off with this:
    Code:
    update_endtime();
    this depends on which version of jQuery you're using, but if you're using 1.7+, adding an onchange would look like this:
    Code:
    $("#starttime").on("change",update_endtime);
    probably the best thing about jQuery is that it is extensively documented, with example code for nearly every situation:
    http://api.jquery.com/

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,349
    Thanks
    11
    Thanked 589 Times in 570 Posts
    why use 100s of functions instead of one expression?

    KISS:
    Code:
    <select id='starttime' name='starttime' onchange="endtime.disabled=!this.selectedIndex">
    Last edited by rnd me; 04-25-2013 at 11:24 PM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •