j-FormTab

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

Składnik przenosi zawartość tego składnika pod etykietą <body> (z powodu pozycjonowania)
Zestaw oczekuje array

Konfiguracja:

width {Number} szerokość formy
Szerokość formy widthlg {Number} dla urządzeń lg (default: config.width)
Szerokość formy widthmd {Number} dla urządzeń md (default: config.width)
Szerokość formy widthsm {Number} dla urządzeń sm (default: config.width)
Szerokość formy widthxs {Number} dla urządzeń xs (default: config.width)
Wysokość height {Number}
Wysokość formy heightlg {Number} dla urządzeń lg (default: config.height)
Wysokość formy heightmd {Number} dla urządzeń md (default: config.height)
Wysokość formy heightsm {Number} dla urządzeń sm (default: config.height)
Wysokość formy heightxs {Number} dla urządzeń xs (default: config.height)
margin {Number} jest standardową marżą między formularzami (default: 10)
marginlg {Number} jest standardową marżą dla urządzeń lg (default: config.margin)
marginmd {Number} jest standardową marżą dla urządzeń md (default: config.margin)
marginsm {Number} jest standardową marżą dla urządzeń sm (default: config.margin)
marginxs {Number} jest standardową marżą dla urządzeń xs (default: config.margin)
marginfullscreen {Number} jest standardową marżą dla trybów pełnego ekranu (default: 20)
marginfullscreenlg {Number} jest standardową marżą pełnego ekranu dla urządzeń lg (default: config.marginfullscreen)
marginfullscreenmd {Number} jest standardową marżą pełnego ekranu dla urządzeń md (default: config.marginfullscreen)
marginfullscreensm {Number} jest standardową marżą pełnego ekranu dla urządzeń sm (default: config.marginfullscreen)
marginfullscreenxs {Number} jest standardową marżą pełnego ekranu dla urządzeń xs (default: config.marginfullscreen)
submit {String} łączy się z globalną funkcją function(meta, data, hide) i jest wykonywany, jeśli naciśnięty jest przycisk wysłania
Połączenie cancel {String} do globalnej funkcji i jest wykonywane, jeśli przycisk cancel jest naciśnięty
enter {Boolean} rejestruje klucz enter automatycznie i praktycznie kliknie przycisk wysłania (default: false)
onclose {String} Link do funkcji function(item, close) ( opcjonalne )
onopen {String} Link do funkcji function(item, el) ( opcjonalne )
autofocus {Boolean} umożliwia automatyczne skupienie się na pierwszym wejściu (default: false)
NEW right {Number} prawy margines (odpuszczalny: 0)
NEW bottom {Number} dolna marża (odpowiednio: 0)
NEW useminheight {Boolean} wykorzystuje min-height zamiast atrybutu height CSS (default: false)

Dobrze wiedzieć:

Każdy element z klasą cancel będzie używany jako przycisk odwołania

Źródło danych:

[
	{
		// Required
		id: 'YOUR_ID_OF_THE_FORM',
		name: 'YOUR_NAME_OF_THE_FORM',

		// Optional
		minimized: true,
		data: { blabla: '"data" will be cloned into the form scope' }
		// NEW: scope: false (disables scope)
		// NEW: scope: mycustomscopepath
	}
]

Użyj go z <ui-component name="formtab">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="formtab" path="common.formtab">
	<script type="text/html">
		<div class="padding">
			YOUR CONTENT HERE.
		</div>
	</script>
</ui-component>

<script>
	var common = {};
	common.formtab = [];
	common.formtab.push({ id: '1', name: 'New message' });
	common.formtab.push({ id: '2', minimized: true, name: 'Message: John Deal' });
	common.formtab.push({ id: '3', minimized: true, name: 'Message: Denis Granec' });
</script>