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 6 of 6
  1. #1
    Regular Coder martin_narg's Avatar
    Join Date
    Jul 2002
    Location
    Chamonix, France
    Posts
    600
    Thanks
    1
    Thanked 3 Times in 3 Posts

    event capture on autocomplete dropdowns

    Hey guys,

    Does anyone know how to event capture on an autocomplete dropdown - this would not be the underlying html element but only on the autocomplete dropdown itself.

    I've never come across trying to capture autocompletes before (in fact, ideally i'm trying to ignore keypresses on the autocomplete and only capture those for the underlying input).

    Many thanks for your time and consideration.

    m_n
    "Cos it's strange isn't it. You stand in the middle of a library and go 'Aaaaaaaaaaaaaaaaggggggghhhhhhh!'
    and everybody just stares at you. But you do the same in an aeroplane, and everybody joins in."
    -Tommy Cooper

  • #2
    Senior Coder
    Join Date
    Sep 2005
    Posts
    1,791
    Thanks
    5
    Thanked 36 Times in 35 Posts
    Some code would be useful, 'autocomplete dropdown' could be implemented in a number of ways...

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You mean when autocomplete fills in a form field? If so, Firefox should fire the onchange event, and I think IE fires the onpropertychange event. Don't think there's anything for Opera or Safari.
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #4
    Regular Coder martin_narg's Avatar
    Join Date
    Jul 2002
    Location
    Chamonix, France
    Posts
    600
    Thanks
    1
    Thanked 3 Times in 3 Posts
    hey guys

    the problem i'm facing is that i have a login form that doesn't have a submit button and hence when a user hits the enter key the form doesn't submit as it natively would do - it's necessary to capture the keypress, check if it's the enter key and submit the form. A simplified version would look like this:
    Code:
    function checkSubmit(e) {
      if(e.keyCode == 13) {
        (e.target || e.srcElement).form.submit();
      }
    }
    html:
    <input type="text" name="username" onkeyup="checkSubmit(event);">
    The trouble is that if the user has their browser autocomplete turned on and then they select their username from the dropdown, when they hit enter to select their username from the autocomplete list, the keypress is actually fired on the underlying input element (due to event handling being part of the DOM, and not part of the browser functionality). So I'm apecifically looking to check to see if the user has hit enter to select an autocomplete option. As i mentioned, as autocomplete is not part of the DOM then this is not as simple as it first appears.

    Brothercake:
    Yeah, I've now looked at something similar combining onkeydown and onkeyup to check the previous value against the new value and submitting if necessary. I was hoping for a more elegant solution though using a single event object. Perhaps it's not possible - it seems logical not to be able to capture inbuilt browser functionality when it goes against the various DOM specs, but would be elegant to have all user interaction available to be totally capturable.

    Many thanks for your responses, anything further is greatly appreciated.

    m_n
    "Cos it's strange isn't it. You stand in the middle of a library and go 'Aaaaaaaaaaaaaaaaggggggghhhhhhh!'
    and everybody just stares at you. But you do the same in an aeroplane, and everybody joins in."
    -Tommy Cooper

  • #5
    Master Coder
    Join Date
    Feb 2003
    Location
    Umeå, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Well, I cannot give you an answer, but these sound like they could possibly be of interest:

    <uri:http://www.w3.org/TR/DOM-Level-3-Eve...vent-textInput>
    <uri:http://www.w3.org/TR/DOM-Level-3-Eve...nt-DOMActivate>
    <uri:http://whatwg.org/specs/web-forms/cu...rk/#the-change>
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #6
    Regular Coder martin_narg's Avatar
    Join Date
    Jul 2002
    Location
    Chamonix, France
    Posts
    600
    Thanks
    1
    Thanked 3 Times in 3 Posts
    Very helpful liorean, excellent.

    Many thanks to yourself and all others who responded.

    m_n
    "Cos it's strange isn't it. You stand in the middle of a library and go 'Aaaaaaaaaaaaaaaaggggggghhhhhhh!'
    and everybody just stares at you. But you do the same in an aeroplane, and everybody joins in."
    -Tommy Cooper


  •  

    Posting Permissions

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