Smarty-select NPM

SmartySelect

Demo: https://codepen.io/Alebex/pen/rmWQyg

Usage

    npm install --save smarty-select

HTML Layout

    <div class="select-container">
        <select hidden>
            <option value="value-1">option-1</option>
            <option value="value-2">option-2</option>
            <option value="value-3">option-3</option>
            ...
        </select>
    </div>

    <!-- Multiple select -->
    <div class="select-container">
        <select multiple hidden>
            <option value="value-1">option-1</option>
            <option value="value-2">option-2</option>
            <option value="value-3">option-3</option>
            ...
        </select>
    </div>

Initialize SmartySelect

    import SmartySelect from 'smarty-select';

    const test = SmartySelect(selectContainer, parameters);    
    // selectContainer - HTMLElement or string (with CSS Selector). Required.
    // parameters - object - object with SmartySelect parameters. Optional.

Parameters

Parameter	Type	Default
classes.container	string	'smarty-select'
classes.button	string	'smarty-select__button'
classes.dropdown	string	'smarty-select__dropdown'
classes.dropdownMenu	string	'smarty-select__dropdownMenu'
classes.option	string	'smarty-select__option'
placeholderText	string	'Select options...'
optionHTML(value, index)	function	{ return value; }

Callbacks

Parameter	Type	Description
change(callback)	function	Callback function, call after change select
destroy()	function	Destroy SmartySelect after call function
init()	function	re-initialize the function, after destroy()

Author: Alebex

customSelect select smarty smarty-select html-select Alebex

lodash

@infinitebrahmanuniverse/nolb-smarty @everything-registry/sub-chunk-2785

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago