Skip to content
A Vue Component to convert the native html select-dropdown to searchable dropdown (something similar to the datalist html tag which isn't supported in most of the browsers)
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
images
.npmignore
README.md
index.html
package.json
selectToSearch-es5.js
selectToSearch.css
selectToSearch.js

README.md

Searchable-Select-Dropdown

A Vue Component to convert the native html select-dropdown to searchable dropdown (something similar to the datalist html tag which isn't supported in most of the browsers)

NPM: https://www.npmjs.com/package/select-typeahead-vue

##Installation

###If you are using webpack/browserify

import searchableDropdown from 'select-typeahead';
import 'select-typeahead/selectToSearch.css';

new Vue({
  ...
  components: {
    ...
    'searchable-dropdown': searchableDropdown,
    ...
  },
  ...
})

###If you are not using webpack/browserify Add selectToSearch-es5.js and selectToSearch.css to your html file and use the component.

Usage

Pass the select component's id and modelValue (containing text and value keys) as a prop.

<searchable-dropdown replace-with="#native-select-box" :selected-value.sync='selectedData'></searchable-dropdown>

##Screenshots

Alt text

###Native HTML Select Tag


select usage

###VueJS Component


usage usage

You can’t perform that action at this time.