...

View Full Version : AutoComplete submit form with [enter] key or mouse click



mgisonno
06-02-2006, 09:55 PM
So I'm using the Yahoo AutoComplete, and I'd like to have it submit my form once it has populated the text box. I entered a question in the yahoo developer network group and got a reply, but I'm having a hard time understanding it. Maybe someone can break it down and help me out.

Here is my original quesiton:
--- In ydn-javascript@yahoogroups.com, "Matthew" <matthew_gisonno@...>
wrote:
>
> Hey everyone,
>
> I'd like to leverage this new technology on our website, but am having
> a bit of trouble getting it to function the way I'd like. Any
> suggestions or help would be great. I have gotten the actual Auto
> complete widget to work, but I'd like to have it submit my form when
> someone either clicks the result from the popup, or presses the
> [enter] key on the keyboard.
>
> I have been able to do this by setting an onblur in the input field,
> but this only works with mouse click. As well, it only submits what
> the user typed, not what the auto complete stuck in there.
>
> I've tried adding a timeout before the form submit in hopes that it
> was just submitting too fast. If anyone has any insight, I'd be most
> grateful.
>
> Thanks in advance to anyone and everyone.
>


and their reply:
After creating an autocomplete object ("autoComplete") I subscribed to
the itemSelectEvent event with a function.

autoComplete.itemSelectEvent.subscribe(onItemSelect);

From there it's a matter of providing the onItemSelect function and
having that submit the form.

function onItemSelect(sType, aArgs)
{
YAHOO.util.Dom.get("searchForm").submit();
}


my code:


<script>
autoComplete=new Object()

function onItemSelect(sType, aArgs)
{
YAHOO.util.Dom.get("searchForm").submit();
}

function theForm ()
{
autoComplete.itemSelectEvent.subscribe(onItemSelect);
}
</script>
<body>
<form action="http://intuitsearch.intuit.com/search" autocomplete="off" method="get" id="searchForm" name="searchForm">
<input type="text" id="myInput" onFocus="onItemSelect();">
<div id="myContainer"></div>
</form>


I'm not even sure if I did this right. Basically, the form now submits when the user is using their mouse to click the autocomplete popup, but if they hit the [enter] key, the form just sits there... Any help would be greatly appreciated.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum