Google-like suggestion pulldowns

I'm having some Javascript difficulties with a site I'm building and would love some help.

This project shouldn't require any access to my existing files. You can just build a sample script and I can blend it into my existing code. Of course, I can show you what I've done, too.

The page will typically have three form text input boxes, one for city, state and country. I'm running AJAX code to offer up suggestions of existing database entries for this fields, which pop up in DIV's similar to the suggestions shown on many sites. The one I'm trying to emulate is Google. So, here's what I need.

A form with the three (3) INPUT type="text" boxes - city, state & country.

As you start to type in any of them, a DIV appears with suggestions in it.

Like Google, I'd like the suggestions DIV to appear as the same width as the "text" box that called for it, and I'd like that DIV to appear directly below that "text" box, just like the Google home page.

If you click on the suggestion, the "text" box populates with the clicked text from the suggestion DIV, and the suggestion DIV closes.

If you hit the "down arrow" key when the suggestions DIV appears, but the cursor still appears in the "text" box, focus moves to the first suggestion. Press "down arrow" key again, and the focus moves to the new suggestion, etc. (just like the Google home page) To select the suggestion currently in focus, hit the ENTER key (just like the CLICK process shown in the past paragraph), and the suggestion DIV closes and the selected text appears in the "text" box.

If you hit the "tab" key when the suggestions DIV appears, but the cursor still appears in the "text" box, the suggestions DIV will disappear and the focus shifts to the next "text" box. (moves from city to state, etc.)

This way, the user can "tab" between "text" inputs, but if a suggestion shown is desired, the user can down-arrow to the suggestion desired and hit ENTER to choose it.

If you click away from that "text" box or the related suggestions DIV, the suggestions DIV goes away.

I have the AJAX box checked as I'm creating this project, but really, it's an HTML & Javascript issue. I've already built the AJAX.

I'm assuming this should be a super easy project for your Javascript guru's!

Let me know!

Taidot: AJAX, Javascript, verkkosivujen suunnittelu

Näytä lisää: google suggestion script, javascript google suggestion box, what is google code, the google guru, text guru, suggestion box design, sites like guru, sites google c, pop up arrow, guru sample, guru javascript, guru home, guru database, google sites script, google guru, database guru, building super, google javascript suggestion, javascript input suggestion, javascript suggestion box google, html suggestion div, suggestion div, google suggestion, country m, arrow up

Tietoa työnantajasta:
( 1 arvostelu ) Chesterfield, United States

Projektin tunnus: #491088

Myönnetty käyttäjälle:


I am ready to do it....

70 $ USD 2 päivässä
(26 arvostelua)

6 freelanceria on tarjonnut keskimäärin 67 $ tähän työhön


I'm interested, Thanks! (one question: where to fetch the suggestion from? database? or textfile? or hardcoded?) reply in PMB.

45 $ USD 1 päivässä
(10 arvostelua)

I just finished a similar page like you descripted, I think I can finish it in shortest time.

50 $ USD 1 päivässä
(10 arvostelua)

I can do it for you for sure.

44 $ USD 2 päivässä
(2 arvostelua)

Dear Helispot, Its Nice to place a bid here. Just try your program using a list box instead of DIV. If you still cant make it up then i can make it for you in just 2 HOURS.

100 $ USD 0 päivässä
(0 arvostelua)

it can be done in 2 hrs

90 $ USD 0 päivässä
(0 arvostelua)