Introduction

SmartSelect is a jQuery multiple select plugin. It is nice, fast and has lots of useful features which can not be found in other select plugins.

SmartSelect handles complex data models, supports hierarchy structures, and also is able to combine several selects into one and make you page clean.

Features

  • Handles much more complicated data relations than single or multiple select.
  • Unlimited levels or hierarchy supported.
  • Toolbar with search, save as alias, undo, fold/unfold, checkall/uncheckall functionalities.
  • Optimized. 10 times faster than other select plugins with more than 1000+ <OPTION>
  • Almost everything is configurable.
  • Bootstrap compatible but not required.

Example

A sale time select module in a data warehouse project.

  • system requires at least one option selected and the default value is 'last year'.
    On plugin loaded or whenever user deselect all options, system will automatically select the default value.
    Try the following: 1. select 'this year' 2. deselect 'last year' 3. deselect 'this year'
  • 'this month' and 'last month' can be selected together, but both can not be selected with 'this year'
    Try the following: 1. select 'this month' 2. select 'last month' 3. select 'this year'
  • 'last 3 years' or 'last 5 years' can only be selected by itself.
    Try the following: 1. select 'last 3 years' 2. select 'last 5 years'
  • dates under 'common dates' and 'specific dates' can not be selected at the same time.
    Try the following: 1. select 'last 3 years' 2. select '2015'
  • you may select couple of specific 2015 months, or just '2015'. Upper level can not be selected with lower levels. vise vera.
    Try the following: 1. select '2015-04' 2. select '2015-03' 3. select '2015'
  • you may combine months from '2014' or '2015' or just select '2014' and '2015'
    Try the following: 1. select '2015-04' 2. select '2014-12' 3. select '2014' 4. select '2015'
  • click an alias.
    Try the following: 1. select alias 'last 2 months' 2. select alias 'last 2 years'

Setup

<link href="dist/smartselect.min.css" rel="stylesheet" />
<script src="dist/jquery.smartselect.min.js"></script>

Dependencies

Tested with jQuery 1.9.0. May work with earlier versions from 1.7.x.

Copyright

Copyright 2015 Hong Zhang