The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Add delete icons to each word in text input field

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #242387

    I’ve seen this only a few times (can’t think of an example, sorry).
    Say you perform a search with a few key words e.g. “Hello World”, in the search results page, in the input field, how do you attach a delete “x” to each word? E.g. “Hello x” “World x” (with a box border around each word).
    All I have found is how to add an X to the field to delete all words, this feature would be to delete individual words.
    Thanks in advance!


    The mechanism to which you are referring is called “Token Input” and there are quite an array of JavaScript solutions. Here are two jQuery solutions to get you started:

    jQuery Tokeninput
    A jQuery Tokenizing Autocomplete Text Entry

    Tokenfield for Bootstrap
    Advanced tagging/tokenizing plugin for jQuery and Twitter Bootstrap with a focus on keyboard and copy-paste support.

    Keep in mind that Token Inputs require some sort of dataset from which to pull results. If your goal is to use this for a keyword search it may be a bit too niche.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.