TinySelect is a small but highly effective jQuery plugin used to reinforce the default choose field with the assist of reside filtering and distant knowledge supply by way of AJAX requests.
How one can use it:
1. Load jQuery JavaScript library along with the tinyselect.css
and tinyselect.js
into the html web page.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="js/tinyselect.js"></script> <hyperlink rel="stylesheet" href="css/tinyselect.css">
2. Create a fundamental filterable choose field with static knowledge.
<choose id="select1"> <possibility worth="0">possibility a</possibility> <possibility worth="1">possibility b</possibility> <possibility worth="2">possibility c</possibility> <possibility worth="3">possibility d</possibility> <possibility worth="4">possibility e</possibility> <possibility worth="5">possibility f</possibility> <possibility worth="6">possibility g</possibility> <possibility worth="7">possibility h</possibility> </choose>
$("#select1").tinyselect();
3. Create a dynamic filterable choose field the place knowledge is loaded from file.json
.
<choose id="select2"> </choose>
$("#select2").tinyselect({ dataUrl: "file.json" });
4. Disable the reside filter.
$("#select1").tinyselect({ showSearch: false });
5. Customise the textual content for AJAX loading standing.
$("#select1").tinyselect({ txtLoading: "Loading...", txtAjaxFailure: "Error...", });
6. Customized perform to parse knowledge from ajax request.
$("#select1").tinyselect({ dataParser: perform(){} });
7. All default choices.
// Present search field showSearch: true, // case delicate? searchCaseSensitive: true, // Textual content to point out whereas loading ajax request txtLoading: "Loading...", // Textual content to point out, if ajax loading fails txtAjaxFailure: "Error...", // URL the place to load content material. // If worth is just not set, plugin reads content material from choose ingredient dataUrl: null, // Customized perform to parse knowledge from ajax request dataParser: null
Changelog:
v2.0.1 (2024-08-02)
- DevDepencency updates
- Added command to alter dataUrl
v2.0.1 (2024-08-01)
v2.0.0 (2023-01-05)
v2.0.0 (2022-12-07)
- Up to date packages & deprecated jquery 1.x
v1.0.6 (2018-07-16)
- Up to date dev bundle variations
- Recompiled with newer js uglify (this in flip diminished filesize by 7 bytes.. Yay)
- Replaces tabs from supply
2016-07-09
- Search case sensitivity can now be set
This superior jQuery plugin is developed by McFizh. For extra Superior Usages, please examine the demo web page or go to the official web site.