j-InputTags

jComponent 20 · jcomponent@20 component Przykład załadowany z jComponent 20

Konfiguracja:

required {Boolean} opcjonalny, umożliwia "wymagane" (default: false)
icon {String} opcjonalny, ikona dla etykiety np. home, cog, itp.
Ikony licon {String} opcjonalne, ikonę lewej np. home, cog, itp.
liconclick {String} opcjonalny, droga do metody function(component, input)
Ikony ricon {String} opcjonalne, prawica np. home, cog, itp.
riconclick {String} opcjonalny, droga do metody function(component, input)
label {String} opcjonalny, etykieta (default jest treścią HTML)
after {String} opcjonalny, oznacza to ładunek po etykietowaniu (default: :)
placeholder {String} opcjonalny, dodaje tekst placeholder do wpisu
validate {String} opcjonalny, warunek weryfikacji wartości, może zawierać link do function(value) lub !!value.match(/[a-z]+/)
disabled {Boolean} opcjonalny, wyłącza ten składnik
error {String} opcjonalny, dodaje tekst string pod składnikiem
spaces {Boolean} opcjonalny, umożliwia przestrzenie w przeciwnym razie usuwa je (default: true)
innerlabel {Boolean} opcjonalny, umożliwia etykietę wewnętrzną (default: true)
dirsource {String} opcjonalny, ścieżka do źródła danych lub NEW może zawierać link do metody function(search, next(items_arr))
dircustom {String/Boolean} jest opcjonalny, może zawierać ścieżkę do function(val, next(new_val)) lub może być Boolean. ta opcja może umożliwić dodanie wartości dostosowanej (wartość nie jest zdefiniowana w źródle danych)
dirrender {String} opcjonalny, ścieżka do function(item, text) (musisz zwrócić HTML dla j-Directory), ta funkcja może wpływać na listę elementów w j-Directory
dirminwidth {Number} opcjonalny, minimalna szerokość dla j-Directory, domyślnie: 200
dirmaxwidth {Number} opcjonalny, maksymalna szerokość dla j-Directory
dirplaceholder {String} opcjonalny, miejsce dla j-Directory
dirempty {String} opcjonalny, dodaje puste pole do j-Directory
dirkey {String} opcjonalny, nazwa kluczowa do czytania text w dirsource (default: name)
dirvalue {String} opcjonalny, nazwa kluczowa do czytania value w dirsource (default: id)
autosource {String} Droga do search Funkcja w autocomplete, function(search, render(arr))
autovalue {String} - trasa właściwości dla wartości w autosource
Opcjonalny transform {Number}, przekształca tekst 0 - none, 1 - lowercase, 2 - uppercase, 3 - capitalize (default: 0)
Opcjonalnie enteronly {Boolean} dodaje nową wartość po naciśnięciu klucza enter (default: true)

Interesujące jest:

dirsource:path.to.datasource potrzebny directory składnik
Jeśli licon lub ricon zaczyna się od !, to składnik daje wartość surową zamiast icon.
dirsource z ścieżkami do metod może ładować dane w sposób niesynchronny

Użyj go z <ui-component name="inputtags">Gdy element nie jest jeszcze ładowany, jComponent Pobierz go po pierwszym użyciu z adresu DEF.fallback (Wydaje się Componentator Autor: Peter Širka Źródło: Componentator Zestaw składników, licencja MIT.

example.html

<ui-component name="directory" config="placeholder:Search..."></ui-component>

<div style="width:400px">
	<ui-component name="inputtags" path="form.frameworks" config="required:1;placeholder:Type a framework name;dirsource:frameworks">Framework</ui-component>
	<br />
	<ui-component name="inputtags" path="form.countries" config="innerlabel:true">Country</ui-component>
</div>

<script>
	var frameworks = [{ id: 1, name: 'jComponent' }, { id: 2, name: 'Angular.js' }, { id: 3, name: 'React' }];
	var form = { framework: [1], countries: ['Slovakia', 'Poland', 'Hungary', 'Germany'] };
</script>