Idea for new User Input element: Tag input

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

This is fantastic and a great idea! Love your example.

@Daniel Interesting idea. You should really post this in the Wix Code Forum here

Done! :slight_smile: https://www.wix.com/code/home/forum/community-feature-request/idea-for-new-user-input-element-tag-input

@pptgames I just added a comment with video :wink:
Cheers

I love this idea!