<select> popovers

A jQuery plugin to replace the traditional <select> box with a sleek Popover with options pre-populated. Better User interface than any other multiselects

Amazing Features out of the box

Sync with original select

Maximum Allowed options

Auto-growing textarea.

Works with Bootstrap

Easy methods and options

Preselect multiple values

Delete Key Support

Multiple Direction Popovers

MIT Licensed, Open Source


#1: Max Allowed upto 2

  showTitle: false,
  maxAllowed: 2


#2: Popover placed at the bottom

  showTitle: false,
  placeholderText: 'Click to Add More',
  position: 'bottom'


#3: Pre-Populated values

  showTitle: false


<select id="example3" multiple>
  <option value="game-of-thrones">Game Of Thrones</option>
  <option value="prison-break">Prison Break</option>
  <option value="lost">Lost</option>
  <option value="sherlock-holmes" selected="selected">Sherlock Holmes</option>
  <option value="true-detectives" selected="selected">True Detectives</option>



Parameter Type Default Value Description
width number reads from elem The Width of the new textarea that is generated. It reads the default from the select but can be overwritten by passing in width param
position string 'top' Currently Supports top and bottom positions
maxAllowed number 0 The maximum number of tags that are allowed inside the textarea. After which the tags inside the popover are disabled. Keep 0 removing any limit
autofocus boolean false When the document is initilized it will autotomaticallu open up the popover and focus the textarea
autoIncrease boolean true Automatically increases and decreases the height of the textarea placeholder
showTitle boolean false Whether to show a Title in the popover box
showTitle boolean false Whether to show a Title in the popover box
placeholderText string 'Click to Add Values' The Placeholder text that is shown in the texarea before the tags are clicked
debug boolean false If true, then it shows debug message in the console. Should only be used in developer console.


Method Name Usage Description
value $(elem).popSelect('value') Returns the current selected values

Let's Get In Touch!

Have some Feedback to share ? Some bug to report ? Contact me below

Jay Kanakiya

Jay Kanakiya

Front End Developer


A jQuery plugin to replace multiselect with sleek popovers

popSelect is a jQuery plugin to replace the traditional select box with a sleek Popover with options pre-populated for a better User interface.

popSelect jQuery plugin REQUIRES Windows
RATING 5 (23 ratings)
Price: $0