SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Feb 2008
    Posts
    165
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    onclick and onkey? How to handle form rules

    Here's the JS:

    HTML Code:
    $("#select_2").hide();
    
    $("#select").click(function(){
      if ($("#option_1").not(":selected")){
        $("#select_2").hide();
      }
      if ($("#option_1").is(":selected")){
        $("#select_2").show();
      }
    });
    The HTML goes something like
    HTML Code:
    <select id="select">
      <option value="something">something</option>
      <option value="something else">something else</option>
      <option id="option_1" value="option_1">OPTION 1</option>
    </select>
    
    <select id="select_2">
      <option value="something">something</option>
      <option value="something else">something else</option>
    </select>
    I have a form that shows a drop down of choices. If the user selects 'OPTION 1' from the list, they are shown another drop down with more choices. The second drop down is hidden by default and shown only if 'OPTION 1' is selected.

    This works fine when using the mouse, but the user can tab to this field, choose 'OPTION 1', and the next field does not show because of my onclick event handler. Is there a way I can look for either the keyboard or the mouse?

    Thanks for any help with this!

  2. #2
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    You can use the "onchange" event, so something like:

    Code:
    $("#select1").change(function(){ /* your code */ });
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  3. #3
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    336
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Is there a way I can look for either the keyboard or the mouse?
    Use jQuery's bind function
    HTML Code:
    $("#select").bind('click change', function() { // your code // });

  4. #4
    SitePoint Zealot
    Join Date
    Feb 2008
    Posts
    165
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Perfect. Looks like .bind is going to do the trick.

    - Thanks!


Tags for this Thread

Bookmarks

Posting Permissions

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