Pretty Select Box Replacemenet With Pure JavaScript – tastySelect

Category: Form , Javascript , Recommended | July 10, 2018
Views Total:3,721 views
Official Page:Go to website
Last Update:July 10, 2018


Pretty Select Box Replacemenet With Pure JavaScript – tastySelect


tastySelect is a JavaScript plugin to create animated, pretty nice, multi-select dropdown list without any dependencies.

Basic Theme:

tastySelect Basic Theme

How to use it:

Import the tastySelect’s JavaScript and Stylesheet into the webpage.

<link rel="stylesheet" href="tastySelect.css">
<script src="tastySelect.min.js"></script>

Create a normal ‘multiple’ select element as these

<select name="" id="tastySelect" multiple>
  <optgroup label="JavaScript">
    <option value="jQuery">jQuery</option>
    <option value="React">ReactJS</option>
    <option value="Angular">AngularJS</option>
  <optgroup label="HTML">
    <option value="HTML5">HTML 5</option>
    <option value="XML">XML</option>
    <option value="XHTML">XHTML</option>
  <option value="css">CSS/SCSS/LESS</option>
  <option value="more">More Options Here</option>

Initialize the tastySelect library and done.

  defaultText: "Select Multiple Options Via (Ctrl+Click)"

More configuration options with default values.

  selector: 'select',
  mobileFix: true,
  mask: '%',
  maskJoin: ', ',
  ctrlKey: false,
  search: false,
  defaultText: 'Select item...',
  classes : {
    outer: 'style-select',
    title: 'style-select-title',
    options: 'style-select-options',
    label: 'style-select-label',
    searchOuter: 'style-select-search-outer',
    search: 'style-select-search',
    optgroup: 'style-select-optgroup',
    list: 'style-select-list',
    item: 'style-select-option',
    open: 'st_open',
    selected: 'st_selected',
    disabled: 'st_disabled',
    mobile: 'is_mobile',
    multiple: 'is_multiple',
  attributes : {
    index: 'data-index',
    value: 'data-value',
    selectReady: 'data-tastyselect',



  • Added the ability to search by options

You Might Be Interested In:

One thought on “Pretty Select Box Replacemenet With Pure JavaScript – tastySelect

  1. ddghfdg

    doesn’t work on Mac, Safari is number 2 most used browser.


Leave a Reply