# j-Input > j-Input je multifunkčný vstupný komponent, ktorý podporuje množstvo funkcií a je optimalizovaný pre každodenné použitie. Je to skvelá alternatíva k j-Textbox a j-Dropdown. Funguje iba so jComponent +v17. Framework: jcomponent20 Product: jComponent 20 (jcomponent@20) Language: sk Content-SHA256: fd119bfd8f6fe448261738d1d11a491c1ba4a2855967b07f7683316b80b2d1c6 Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e Review: not-recorded __j-Input__ je multifunkčný komponent `input`, ktorý podporuje množstvo funkcií a je optimalizovaný pre každodenné použitie. Je to skvelá alternatíva k `j-Textbox` a `j-Dropdown`. Funguje len so jComponent `+v17`. __Konfigurácia__: - `type {String}` voliteľné, hodnoty: - prázdna hodnota znamená predvolenú hodnotu `text` - `email`, - `multiline` - `checkbox` - `phone` - `password` - `zip` - `date` (potrebuje komponent `datepicker`) - __NOVINKA__: `datetime` (potrebuje komponent `datepicker`) - `time` (potrebuje komponent `timepicker`) - `color` (potrebuje komponent `colorpicker`) - `icon` (potrebuje komponent `faicons`) - `emoji` (potrebuje komponent `emoji`) - `url` - `number` - `number2` (nulovateľné) - `search` - `lower` - `upper` - `slug` - `id` - __NOVINKA__: `radiobutton` - __NOVINKA__: `tags` - __NOVINKA__: `tags-lower` - __NOVINKA__: `tags-upper` - __NOVINKA__: `tags-id` - __NOVINKA__: `tags-email` - __NOVINKA__: `tags-slug` - __NOVINKA__: `tags-phone` - __NOVINKA__: `tags-url` - `required {Boolean}` voliteľné, umožňuje "povinné" (predvolené: `false`) - `icon {String}` voliteľné, ikona pre štítok napr. `home`, `cog` atď. - `licon {String}` voliteľné, ikona vľavo napr. `home`, `cog` atď. - `liconclick {String}` voliteľné, cesta k metóde `function(component, input)` - `ricon {String}` voliteľné, pravá ikona napr. `home`, `cog` atď. - `riconclick {String}` voliteľné, cesta k metóde `function(component, input)` - `label {String}` voliteľné, štítok (predvolený je obsah HTML) - `autofocus {Boolean}` voliteľné, zaostrí vstup (predvolené: `false`) - `align {String}` voliteľné, `left` (predvolené), `2` / `right` alebo `1` / `center` - `after {String}` voliteľné, to znamená znak za štítkom (predvolené: `:`) - `autofill {Boolean/String}` voliteľné, umožňuje funkciu automatického dopĺňania prehliadača (ako názov vstupu sa použije `string`, predvolené: `false`) - `placeholder {String}` voliteľné, do vstupu pridá text `placeholder` - `maxlength {Number}` voliteľné, nastavuje maximálnu dĺžku znakov (predvolené: `200`) - `minlength {Number}` voliteľné, nastavuje minimálnu dĺžku znakov - `minvalue {Number}` voliteľné, minimálna hodnota pre typ `number` - `maxvalue {Number}` voliteľné, maximálna hodnota pre typ `number` - `increment {Number}` voliteľné, nastavuje hodnotu pre zvýšenie (predvolené: `1`) - `validate {String}` voliteľné, podmienka pre overenie hodnoty, môže obsahovať prepojenie na `function(value)` alebo `!!value.match(/[a-z]+/)` - `format {String}` voliteľné, formátovanie výstupu napr. pre `date` typ: `yyyy-MM-dd`, pre `time` typ: `HH:mm`, pre `number` môžete definovať max. desatinné miesta (predvolené: `auto`) - `disabled {Boolean}` voliteľné, deaktivuje tento komponent - `error {String}` voliteľné, pridá text `string` pod komponent - `autocomplete {String}` voliteľné, musí obsahovať prepojenie na funkciu, spúšťa sa pri udalosti `focus` - `spaces {Boolean}` voliteľné, povolí medzery, inak ich odstráni (predvolené: `true`) - `innerlabel {Boolean}` voliteľné, umožňuje vnútorný štítok (predvolené: `true`) - `dirsource {String}` voliteľné, cesta k zdroju údajov alebo __NEW__ až `function(search, next)` (cesta musí obsahovať `/` alebo __NEW__: `id|name,id|name` - `dircustom {String/Boolean}` voliteľné, môže obsahovať cestu k `function(val, next(new_val))` alebo môže byť `Boolean`. Táto možnosť môže povoliť pridanie vlastnej hodnoty (hodnota nie je definovaná v zdroji údajov) - `dirrender {String}` voliteľné, cesta k `function(item, text)` (musí vrátiť HTML pre `j-Directory`), táto funkcia môže ovplyvniť zoznam položiek v `j-Directory` - `dirminwidth {Number}` voliteľné, minimálna šírka pre `j-Directory`, predvolená: `200` - `dirmaxwidth {Number}` voliteľné, maximálna šírka pre `j-Directory` - `diroffsety {Number}` voliteľné, posun `Y` (predvolené: `0`) - `diroffsetx {Number}` voliteľné, posun `X` (predvolené: `0`) - `dirplaceholder {String}` voliteľné, zástupný znak pre `j-Directory` - `dirempty {String}` voliteľné, pridá prázdne pole pre `j-Directory` - `dirkey {String}` voliteľné, názov kľúča na čítanie `text` v `dirsource` (predvolené: `name`) - `dirvalue {String}` voliteľné, názov kľúča na čítanie `value` v `dirsource` (predvolené: `id`) - `direxclude {Boolean}` voliteľné, vylučuje aktuálnu hodnotu zo `j-Directory` (predvolené: `true`) - `dirsearch {Boolean|String}` voliteľné, môže zakázať vyhľadávanie v `j-Directory` (predvolené: `true`) alebo `{String}` (názov kľúča) môže mapovať hodnotu pre vyhľadávanie - `dirraw {Boolean}` voliteľné, môže zakázať escapovanie položiek pre `j-Directory` (predvolené: `false`) - `dirdetail {String}` voliteľné, prepojenie na funkciu `function(val, next(NEW_TEXT))` (cielené na `dirsource`) - `dirfilter {String}` voliteľné, podmienená metóda vloženého filtra, napríklad: `value.id !== 2` (zacielené na `dirsource`) - __NEW__: `dirrawrender {Boolean}` voliteľné, ak `dirsource` nezahŕňa hodnotu, zobrazí sa nespracovaná hodnota (predvolené: `true`) - `mask {String}` voliteľné, môže obsahovať masku v tvare `###/##` (`#` je nahradené znakom) - `maskregexp {String}` voliteľné, môže obsahovať RegExp pre každý znak v tvare `\d,\d,\d,null,\d,\d` (`,` je oddeľovač) - `masktidy {Boolean}` voliteľné, komponent vracia iba nespracované znaky bez pevných znakov (predvolené: `false`) - `autosource {String}` cesta k zdroju vyhľadávania `Array` (__NEW__) alebo `function(search, render(arr))` pre dynamické vyhľadávanie - `autovalue {String}` cesta vlastnosti pre hodnotu v `autosource`, predvolená hodnota: `name` - `autoexec {String}` a spôsob cesty `function(item, next(value_to_input))` - `searchalign {Number}` môže zarovnať ikonu na `type:search` doľava (`2`) alebo doprava (`1`, predvolené) - `forcevalidation {Boolean}` umožňuje overenie sily pre `phone` a `email` (predvolené: `true`) - `camouflage {Boolean|String}` maskuje hodnotu na vstupe po spustení udalosti `blur` (predvolené: `false`) alebo to môže byť `String`, ktorá bude použitá ako kamufláž - `monospace {Boolean}` povolí písmo `monospaced` (predvolené: `false`) - `multiple {Boolean}` aktivuje začiarkavacie políčka, ak `dirsource` nie je prázdne - `tabindex {Number}` pridá tabindex (predvolené: `0`) - `tabs {Boolean}` povoľuje karty pre viacriadkové (predvolené: `true`) - Vydanie blokového textového poľa `readonly {Boolean}` (predvolené: `false`) - `transform {String}` prepojenie na `function(value, config)` pre transformáciu zadaných hodnôt - `multiline {Boolean}` funguje len s typom `radiobutton` - `separator {String|Boolean}` oddeľovač pre viacero vykreslených hodnôt - `realtime {Boolean}` umožňuje viazanie v reálnom čase (predvolené: `true`) - `exec {String}` prepojenie na `function(value, element)`, ktoré sa vyhodnotí, ak bude ovplyvnený vstup __Zaujímavé:__ - `type:date` potrebuje __`datepicker`__ komponent - `type:time` potrebuje __`timepicker`__ komponent - `dirsource:path.to.datasource` potrebuje __`directory`__ komponent - ak `licon` alebo `ricon` začína `!`, potom komponent vykreslí surovú hodnotu namiesto `icon` - Trieda `ui-input-ok` je viazaná, keď je vstup validovaný a vyplnený - `SET('path', 'camouflage', 'show');` zobrazuje hodnotu pre 2000 ms ```video https://www.youtube.com/watch?v=Ne3ezaP0w34 ``` Použite ho so ``. Keď komponent ešte nie je načítaný, jComponent ho stiahne pri prvom použití z adresy v `DEF.fallback` (predvolene CDN Componentator). Autor: Peter Širka. Zdroj: úložisko komponentov Componentator, licencia MIT. ```html example.html
Framework I agree with terms Notes Frameworks
City
Tags
Date
Search
Password
ZIP
Email
Phone
Gender
Gender
Your age
```