Textarea with suggestions when user enters # - javascript

I'd like to know how to implement a textarea where a user can tag people by typing # and then write a person's name. You get inline suggestions for word matches.
I'm not even sure what the technical name would be for such a feature but it's a common in sites like Facebook.

You want an autocompleter of some sort.
Have a look at this jQuery autocomplete tagging plug-in like StackOverflow's input tags?

The solution for this is using jQuery Tokeninput.
Hopefully you are looking for some Twitter style autocomplete

Related

Rails text field as select field with look up

I have a model Item, that has_many Tags.
I would like to make a form field on the Item form like a text field, where the solution looks up matching tags, when the use enters text.
The user should be able to select multiple tags, but the user should not be able to select tags that does not exist in the system.
Basecamp is doing this in this screenshot for the "With" field, and Stackoverflow do it for the tag field.Can you help me how I do this?
Screenshoot from Basecamp
Consider using a gem like acts-as-taggable-on (https://github.com/mbleigh/acts-as-taggable-on), which is well suited to your stated requirements.
I found this solution, which is exactly what I was looking for:
https://github.com/tsechingho/chosen-rails

Textarea suggestion giver

Are there any bootstrap or jQuery tools that give me suggestions when I type something in a textarea? like autocomplete but I don't want to replace the whole text when I click on the suggestion. I want something like SQL editor when I start typing a table name, tables name starting with that particular letter should suggestest me. When I click on a suggestion, particular suggestion should append with the existing sentences.
http://autocomplete-js.com/
Pretty much my go to autocomplete library i use in the frontend. It has no dependencies, which is awesome.
If you're more into jQuery, here's one from jQuery UI

Using a forced suggestion mechanism using JavaScript and jQuery (ASP.NET MVC project)

Yesterday I discovered that jQuery is really powerful and can do amazing things with only a few (sometimes just one) line of code, amazing! I did some animating which went really well!
So I was wondering if the following is also possible/ simple to implement with jQuery (if not, please tell me what could do this):
Basically I want a suggestion mechanism for the webapplication we are creating. We are doing this using ASP.NET MVC 4. By suggestion mechanism I mean the user gets presented with a textfield, he can start typing and based on his typing topics (I have a model class Topic with a few properties) get suggested. The user can ONLY choose out of those topics, they can't define any by themself. So I would like to generate a list based on the input (with each key tap). If they click on an item, it gets added to the box and they can choose other topics if they would want to.
I do realize that this is probably rather difficult to implement, but it would be great if I could find a tutorial or example. Preferable with JavaScript or jQuery, but if that's not possible anything will do really!
If my explanation is not clear enough: I mean something similar to the StackOverflow suggestion mechanism for tags.
If you want suggestive text field, search for html5 datalist datalist
Also take a look at JqueryUI Auto Complete
However if the options are not too much, i would go with select menu instead of text field.

Selectable textbox

I have a use case for a textbox but that has some default options e.g. if a user was asked to type their address but it would also be a select box so they could select their home address or work address.
Is there something out there like this? I have been googling but i cant see anything similar but i could be googling the wrong thing entirely.
Thanks
Have you looked at the jquery autocomplete plugin?
It has the functionality you are looking for plus the ability to automatically filter the user's options based on what the user is typing.

Text field containing multiple values, suggestions in a drop-down (like Gmail "To:" field)

I need functionality in my web application similar to Gmail's drop-down of suggestions when entering recipient addresses, or Stack Overflow's drop-down when entering tags for in question composition.
In Gmail, there is a text field for the "To:" address. Once you start typing, a drop-down appears with suggestions. If you enter a semi-colon or comma, you can enter another address. Again, once you start typing this address, a drop-down appears with suggestions.
The suggestions are the subset of your address book containing the text you've entered. (E.g. if you typed "jo" then "John" and "Foojoe" would appear as suggestions, but "XYZ" would not.) The matched part of the word is highlighted in bold.
If you press "enter" or use the up and down cursor keys, you can navigate around the drop-down suggestion list.
I could presumably program this myself, however I have the feeling there must be standard solutions out there I could incorporate. However, all I found were solutions where the value of the field led to the suggestions, and not the value of the current part of the field led to the suggestions (where each part was separated by a separator, for example "," or ";" in the case of Gmail, or space in the case of Stack Overflow tags).
I am using Wicket (Java server-side Web framework) so any Wicket-specific solution would be great, but otherwise I'm sure I can incorporate any plain Javascript library in the project.
jQueryUI's autocomplete is a great plugin.
http://jqueryui.com/demos/autocomplete/#multiple
The link is to the "multiple values" example which is almost word for word what you described; it matches partial words from the middle, it allows key-based navigation, multiple entries.
You can use the AutoCompleteTextField class in wicket-extensions for this.
Wicket Examples provides a sample implementation as the first item in its AJAX section. The source code link is kind of hard to see, it's at the right edge of the gray bar.
(The description even says "like google suggest!")
There are some JQuery plugins for that out there, for example:
FCBKcomplete
Tokenizing Autocomplete Text Entry
There is a AutoComplete Component in the Wicketstuff project. There is an Blog on how to use it.

Categories