I need help setting up a form, I want to do some pretty neat things:
It will say: What countries do you want to visit? [FIELD]
Part 1: I want that when a user starts typing into the field, it will suggest under things that match what you have typed so far, sort of like facebook search does. So I would need a list of recognized country names. Now for example imagine I was using this, and I typed in M, it would list under a max of 5 valid entries begining with M, if I typed in Me, it would list the ones begining with Me, if I typed in Mex, it would show Mexico. Now the user would have to click this drop down suggestion to choose it.
Part2: I want once a user clicks on a suggestion, it will "pop under" the input box or somewhere, with a "x" beside it to remove it. The user can now type in another country, and when it is clicked it too appears as a sort of "icon" under the input box or somewhere, with an "x" beside it. Clicking the x removes the country from the current list of countries. Once he is done, he goes on to other fields and the selected countries remain visible. Once a user submits the form, I want to get only the countries that were visible to him.
**An alternative idea, if this one is too complicated, would be to have a drop list with all countries in it, and once a person clicks one, it will remain and a "+" sign will appear under it. When pressed, another dropdown menu will appear so the person can choose another country from the second drop down, etc. OFC all selected countries can have an X to remove them. Idk how to do this either..
I need help guys I have no clue how to do something like this, where do you recommend I start? Any ideas? I tried searching but I'm not sure what to call this so I couldn't find anything in the search.
Thanks, that is the type of thing I was talking about! I finally have a name for it and some reading material!
What I am trying to do is pretty much the same, but when you click the text, i want it to "pop up" under, similar how tagging works on many sites like wordpress, etc. Any ideas how I can make those "floating tags" from the clicked ones, and add an X to remove them, and send their data when user hits "submit" on the form? *phew*
Thanks for the help so far!!
subject: coding HTML/JS Form with multiple selections?