Bootstrap Tokenfield screenshot

Bootstrap Tokenfield

Author Avatar Theme by Sliptree
Updated: 28 Sep 2020
857 Stars

A jQuery tag/token input plugin for Twitter's Bootstrap, by the guys from Sliptree

Overview:

Bootstrap Tokenfield is a jQuery tagging/tokenizer input plugin designed for Twitter’s Bootstrap UI framework, developed by Sliptree. This plugin allows users to add tags or tokens to input fields, offering features like token copy/paste, keyboard navigation, and support for Twitter Typeahead and jQuery UI Autocomplete. It is important to note that this project is no longer actively maintained.

Features:

  • Easy Installation: Can be installed via npm, bower, or manually downloaded.
  • Token Copy/Paste: Allows users to copy and paste tokens with keyboard shortcuts.
  • Keyboard Navigation: Users can navigate and delete tokens using arrow keys and keyboard shortcuts.
  • Multi-select: Supports selecting specific tokens with Ctrl+click and Shift+click.
  • Twitter Typeahead and jQuery UI Autocomplete Support: Integrates with these popular libraries for enhanced functionality.

Installation:

To install Bootstrap Tokenfield, follow these steps:

  1. Ensure you have jQuery 1.9+ and Bootstrap 3+ (CSS only) in your project.
  2. Install via npm or bower:
    • npm install bootstrap-tokenfield
    • bower install bootstrap-tokenfield
  3. Include the following files in your HTML:
    <script src="path/to/bootstrap-tokenfield.js"></script>
    <link rel="stylesheet" href="path/to/bootstrap-tokenfield.css">
    

Summary:

Bootstrap Tokenfield is a useful jQuery plugin for implementing tagging/token input fields within Bootstrap projects. It offers various features like token copy/paste, keyboard navigation, and integration with libraries like Twitter Typeahead and jQuery UI Autocomplete. While the project is no longer actively maintained, users can still benefit from its functionality by following the installation guide provided above.