Idea for new User Input element: Tag input

Ask the community
,
1

A tag input is just like a text input but when the user presses for instance Enter, it will add a little box with the text that was written in the input. The make my self clear, I have made a tag input using HTML: https://www.w3schools.com/code/tryit.asp?filename=FZTJBTB2LN8B
It has everything I would need.
Settings (not by order)

JS properties
maximumTagLength (0 - no maximum length)
minimumTagLength (0 - no minimum length)
addNewTag (example: [“press-enter”, “press-comma”, “press-spacebar”])
placeholder (string)
removeTagIcon (image URL)
backspaceRemovesLastTag (boolean)
value (array, example: [“tag1”, “tag2”, “tag3”])
Design
Fill color - background, tags
Border - background, tags
Corners - background, tags
Shadow - background, tags
Text - tags
…
Layout
Space between tags
Space between tag text and remove icon
I didn’t include everything, but is obvious. I have this kind of input on my WebSite with an HTML component, but it causes some problems… so I really want to have it built-in on Wix.
Any suggestions are welcome,
thank you.

2 Likes
2

I like this idea. It is similar to the notion of hashtagging where #tagElement gets flagged and potentially collected in a common area to show key word or phrases on a page. Alternatively your proposal where you can create the tags in a container.

I took the liberty of creating a youtube of your code in action :wink:

3

How can you sync those tags with your wix database? :slight_smile:

4

There is literally a field type called Tags. You could use that or a JSON Array converted to a String.
An array would look like this: [ “tag1”, “tag2”, “tag3” ]

5

this looks good, can you please add the wix corvid part that connects it to the db?