Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
tail.select
Advanced tools
Readme
Replace and Improve your HTML <select>
fields with style and without jQuery!
The tail.select script is back, re-written in vanilla JavaScript and ready to beautify and
extend your HTML <select>
fields... again! Add a search bar, multi-selection utilities (such as
select all or none buttons), deselectability on single select fields, a perfect design and many
more user-friendly functions to your web-application.
Wanna see tail.select in action?
Wanna translate tail.select in your language?
You really like my tail.select script and want to support me and all of my projects?
Then I would be extremely grateful for a coffee! (Thanks to all Supporters)
The master branch will always contain the latest Release, which you can download directly here as .tar or as .zip archive, or just visit the Releases Page on GitHub directly. You can also be cool and using npm, Yarn or bower:
npm install tail.select --save
yarn add tail.select --save
bower install tail.select --save
You can also use the awesome CDN services from jsDelivr or UNPKG.
https://cdn.jsdelivr.net/npm/tail.select@latest/
https://unpkg.com/tail.select/
The Documentation has been moved to GitHubs Wiki Pages, but I will keep a table of contents list here and some basic instructions.
The tail.select
package contains different JavaScript files:
js/tail.select(.min).js
The main JavaScript with en
tranlation strings only.js/tail.select-full(.min).js
The main JavaScript with ALL available translations.js/tail.select-es6(.min).js
An experimental ECMAScript 2015 / ES6 Module version (includes all translations).langs/tail.select-all(.min).js
Just ALL translation strings itself.langs/tail.select-{locale}.js
Just the {locale} translation strings.You can pass up to 2 arguments to the tail.select constructor, the first parameter is required
and need to be an Element
, a NodeList
, a HTMLCollection
, an Array with Element
objects or
just a single selector as string
, which calls the querySelectorAll()
method on its own. The
second parameter is optional and, if set, MUST be an object with your tail.select options.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link type="text/css" rel="stylesheet" href="css/tail.select-default.css" />
</head>
<body>
<script type="text/javascript" src="js/tail.select.min.js"></script>
<!-- <script type="text/javascript" src="langs/tail.select-{lang}.js"></script> -->
<select>
<option>My Option</option>
</select>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function(){
tail.select("select", { /* Your Options */ });
});
</script>
</body>
</html>
Please check out GitHubs Wiki Pages to read more about each single option!
tail.select("select", {
animate: true, // [0.3.0] Boolean
classNames: null, // [0.2.0] Boolean, String, Array, null
csvOutput: false, // [0.3.4] Boolean
csvSeparator: ",", // [0.3.4] String
descriptions: false, // [0.3.0] Boolean
deselect: false, // [0.3.0] Boolean
disabled: false, // [0.5.0] Boolean
height: 350, // [0.2.0] Integer, null
hideDisabled: false, // [0.3.0] Boolean
hideSelected: false, // [0.3.0] Boolean
items: {}, // [0.3.0] Object
locale: "en", // [0.5.0] String
linguisticRules: { // [0.5.9] Object
"е": "ё",
"a": "ä",
"o": "ö",
"u": "ü",
"ss": "ß"
},
multiple: false, // [0.2.0] Boolean
multiLimit: Infinity, // [0.3.0] Integer, Infinity
multiPinSelected: false, // [0.5.0] Boolean
multiContainer: false, // [0.3.0] Boolean, String
multiShowCount: true, // [0.3.0] Boolean
multiShowLimit: false, // [0.5.0] Boolean
multiSelectAll: false, // [0.4.0] Boolean
multiSelectGroup: true, // [0.4.0] Boolean
openAbove: null, // [0.3.0] Boolean, null
placeholder: null, // [0.2.0] String, null
search: false, // [0.3.0] Boolean
searchConfig: [ // [0.5.13] Array
"text", "value"
],
searchFocus: true, // [0.3.0] Boolean
searchMarked: true, // [0.3.0] Boolean
searchMinLength: 1, // [0.5.13] Integer
searchDisabled: true, // [0.5.5] Boolean
sortItems: false, // [0.3.0] String, Function, false
sortGroups: false, // [0.3.0] String, Function, false
sourceBind: false, // [0.5.0] Boolean
sourceHide: true, // [0.5.0] Boolean
startOpen: false, // [0.3.0] Boolean
stayOpen: false, // [0.3.0] Boolean
width: null, // [0.2.0] Integer, String, null
cbComplete: undefined, // [0.5.0] Function
cbEmpty: undefined, // [0.5.0] Function
cbLoopItem: undefined, // [0.4.0] Function
cbLoopGroup: undefined // [0.4.0] Function
});
Published under the MIT-License; Copyright © 2014 - 2019 SamBrishes, pytesNET
FAQs
Create beautiful, functional and extensive (Multi) select fields, written in Vanilla without any dependencies!
The npm package tail.select receives a total of 1,703 weekly downloads. As such, tail.select popularity was classified as popular.
We found that tail.select demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.