Loading ...
Sorry, an error occurred while loading the content.

AutoComplete: Trigger click method on textboxBlurEvent over search results

Expand Messages
  • fernandogaleano84
    Hi All. I have the following problem: After the user gets the search results for AutoComplete, if they happen to not select any item and click outside the
    Message 1 of 3 , Jul 28, 2009
    • 0 Attachment
      Hi All.

      I have the following problem:

      After the user gets the search results for AutoComplete, if they happen to not select any item and click outside the result box, the first results need to be selected anyway.

      So to be more graphic: say you type "items" and the AutoComplete results give you a list with "- Item One. - Item Two. - Item Three." Without clicking on any of them, if you click outside the results box or if it disappears because of other action, in this case "Item One" should be selected anyways to populate the field.

      The first and most obvious solution I thought at first was to simply force trigger a click on the first item. So the code looked as follows:

      oAC.textboxBlurEvent.subscribe(function(sType, aArgs){
      this.getListEl().childNodes[0].click();
      });

      Only this produces NOTHING. I can't even get an alert when the click happens. My theory is that the click method is not being triggered at all.

      This is weird because I CAN access any of the LI elements in the results list, I can get or change their properties, see they're innertHTML but I can't trigger any methods.

      Does anybody know what could be causing this? Might there be a different way to force trigger methods on elements like?

      I would really appreciate any help.

      Thank you very much.
    • theblargoner
      The click() method is only intended to be used on certain elements, see e.g. https://developer.mozilla.org/en/DOM/element.click Unfortunately it is not
      Message 2 of 3 , Jul 28, 2009
      • 0 Attachment
        The click() method is only intended to be used on certain <input> elements, see e.g.

        https://developer.mozilla.org/en/DOM/element.click

        Unfortunately it is not that simple to simulate a mouse click event on an arbitrary element, such as a list element. You can do so, but the method will differ by browser.

        In standards compliant browsers you can use document.createEvent(), then initMouseEvent(), to create a mouse event object, then dispatchEvent() to dispatch it on the list element:

        https://developer.mozilla.org/en/DOM/document.createEvent

        In IE, you use the document.createEventObject() method.

        It's a bit ugly. If you have the ability to use YUI 3, the Event class provides a simulate() method that makes it easier:

        http://developer.yahoo.com/yui/3/event/#eventsimulation

        Good luck,
        John

        --- In ydn-javascript@yahoogroups.com, "fernandogaleano84" <fernandogaleano84@...> wrote:
        >
        > Hi All.
        >
        > I have the following problem:
        >
        > After the user gets the search results for AutoComplete, if they happen to not select any item and click outside the result box, the first results need to be selected anyway.
        >
        > So to be more graphic: say you type "items" and the AutoComplete results give you a list with "- Item One. - Item Two. - Item Three." Without clicking on any of them, if you click outside the results box or if it disappears because of other action, in this case "Item One" should be selected anyways to populate the field.
        >
        > The first and most obvious solution I thought at first was to simply force trigger a click on the first item. So the code looked as follows:
        >
        > oAC.textboxBlurEvent.subscribe(function(sType, aArgs){
        > this.getListEl().childNodes[0].click();
        > });
        >
        > Only this produces NOTHING. I can't even get an alert when the click happens. My theory is that the click method is not being triggered at all.
        >
        > This is weird because I CAN access any of the LI elements in the results list, I can get or change their properties, see they're innertHTML but I can't trigger any methods.
        >
        > Does anybody know what could be causing this? Might there be a different way to force trigger methods on elements like?
        >
        > I would really appreciate any help.
        >
        > Thank you very much.
        >
      • fernandogaleano84
        Thank you, John, that surely helps. I ll read on those methods to see if I can implement it in my case. Unfortunately I can t use YUI3 for this particular
        Message 3 of 3 , Jul 29, 2009
        • 0 Attachment
          Thank you, John, that surely helps. I'll read on those methods to see if I can implement it in my case. Unfortunately I can't use YUI3 for this particular issue so I'll have to deal with the browsers problems.

          Thanks again!
        Your message has been successfully submitted and would be delivered to recipients shortly.