Creating a span in an input field like Facebook messages

Question

All, I'm trying to create the same type of functionality that works with the Facebook messages. I'd like to basically have a list of spans (i'm guessing they do something like that) in an input textbox followed by the little to close it out.

Does anyone know how to create something like that?

Thanks in advance!

score 4 · Accepted Answer · answered Feb 22 '12 at 03:23

4

It's the tag and autocomplete textfield. You might want to check the plugin called chosen:

http://harvesthq.github.com/chosen/

or, this plugin, I think it's more relevant:

http://textextjs.com/

answered Feb 22 '12 at 03:23

roxes

113
7

I believe chosen is the best option. It looks nice and it works exactly as facebook readers of message input, and it has some extra features. – Francisco Ochoa Mar 18 '13 at 14:26

score 1 · Answer 2 · answered Feb 22 '12 at 02:27

It's not actually an <input>. It's actually a list <ul> with a leading <input> for typing. Whatever you type, it appends to the list behind it, depending on the auto complete options.

there are several attempts to do this, found here:

http://ajaxian.com/archives/facebook-style-input-box

Creating a span in an input field like Facebook messages

2 Answers2

Linked