## 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

## Examples

#1: Max Allowed upto 2

    $('#example1').popSelect({
      showTitle: false,
      maxAllowed: 2
    });

#2: Popover placed at the bottom

    $('#example2').popSelect({
      showTitle: false,
      placeholderText: 'Click to Add More',
      position: 'bottom'
    });

#3: Pre-Populated values

    $('#example3').popSelect({
      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>
    </select>

## Options

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.

## Others

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

## jQuery PopSelect is Open Source

Download Now!

You can install it from bower or npm

    bower install popSelect

    npm install popselect

## Let's Get In Touch!

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

#### Jay Kanakiya

Front End Developer

## You might also be interested in:

####

####

####

####

popSelect

# 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.

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