# fSelect

**Repository Path**: sense7/fSelect

## Basic Information

- **Project Name**: fSelect
- **Description**: 下拉多选，增加输入框
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2019-02-14
- **Last Updated**: 2024-09-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: JavaScript

## README

# fSelect
A jQuery select box replacement library ([live demo](https://facetwp.com/wp-content/plugins/facetwp/assets/vendor/fSelect/test.html))

<img src="http://i.imgur.com/yXOv8DG.png" width="208" height="223" />

### Usage

```javascript
$('.your-select').fSelect();
```

### Available options

```js
$('.your-select').fSelect({
    placeholder: 'Select some options',
    numDisplayed: 3,
    overflowText: '{n} selected',
    noResultsText: 'No results found',
    searchText: 'Search',
    showSearch: true,
    showConfirm: true,
    activeRecall: function() {
        console.log('activeRecall');
        alert('activeRecall');

        return true;
    },
    
    inactiveRecall: function() {
        console.log('inactiveRecall');
        alert('inactiveRecall');

        return true;
    }
});
```

* **placeholder** (str) - the default placeholder text
* **numDisplayed** (int) - the number of values to show before switching to the `overflowText`
* **overflowText** (str) - the text to show after exceeding the `numDisplayed` limit
* **noResultsText** (str) - the text to show if no choices exist (or an empty string)
* **searchText** (str) - the search box placeholder text
* **showSearch** (bool) - show the search box?

### Methods

```js
$('.your-select').fSelect('reload');
$('.your-select').fSelect('destroy');
```

### Single vs. multi-select

Add the `multiple` attribute to your `<select>` to enable multi-select:

```html
<select class="your-select-box" multiple="multiple">
```