0.1.1 • Published 7 years ago

smarty-select v0.1.1

Weekly downloads
1
License
ISC
Repository
-
Last release
7 years ago

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

ParameterTypeDefault
classes.containerstring'smarty-select'
classes.buttonstring'smarty-select__button'
classes.dropdownstring'smarty-select__dropdown'
classes.dropdownMenustring'smarty-select__dropdownMenu'
classes.optionstring'smarty-select__option'
placeholderTextstring'Select options...'
optionHTML(value, index)function{ return value; }

Callbacks

ParameterTypeDescription
change(callback)functionCallback function, call after change select
destroy()functionDestroy SmartySelect after call function
init()functionre-initialize the function, after destroy()

Author: Alebex