j-FormTab

jComponent 20 · jcomponent@20 component Példa betöltve a jComponent 20-szal

Az összetevő a tartalmat a <body> címké alatt mozgatja (a pozíció miatt)
Az összetevő várja az array

konfiguráció:

width {Number} formájú széles
widthlg {Number} formanyomtatvány szélessége a lg készülékekhez (default: config.width)
widthmd {Number} formanyomtatvány szélessége a md készülékekhez (default: config.width)
widthsm {Number} formanyomtatvány szélessége a sm készülékekhez (default: config.width)
widthxs {Number} formanyomtatvány szélessége a xs készülékekhez (default: config.width)
height {Number} formájú magasság
heightlg {Number} A forma magassága a lg A készülékek (default config.height)
heightmd {Number} A forma magassága a md A készülékek (default config.height)
heightsm {Number} A forma magassága a sm A készülékek (default config.height)
heightxs {Number} A forma magassága a xs A készülékek (default config.height)
margin {Number} a formanyomtatványok között (default: 10)
marginlg {Number} a lg eszközökre vonatkozó előzetes margin (előzetes: config.margin)
marginmd {Number} a md eszközökre vonatkozó előzetes margin (előzetes: config.margin)
marginsm {Number} a sm eszközökre vonatkozó előzetes margin (előzetes: config.margin)
marginxs {Number} a xs eszközökre vonatkozó előzetes margin (előzetes: config.margin)
marginfullscreen {Number} a teljes képernyővel kapcsolatos alapértelmezett margin (default: 20)
marginfullscreenlg {Number} a lg eszközökre vonatkozó alapértelmezett teljes képernyőmargin (például: config.marginfullscreen)
marginfullscreenmd {Number} a md eszközökre vonatkozó alapértelmezett teljes képernyőmargin (például: config.marginfullscreen)
marginfullscreensm {Number} a sm eszközökre vonatkozó alapértelmezett teljes képernyőmargin (például: config.marginfullscreen)
marginfullscreenxs {Number} a xs eszközökre vonatkozó alapértelmezett teljes képernyőmargin (például: config.marginfullscreen)
submit {String} kapcsolat egy globális funkcióhoz function(meta, data, hide) és akkor fut, ha a benyújtási gomb megnyomja
A cancel {String} kapcsolat egy globális funkcióhoz, és akkor fut, ha a cancel gomb megnyomja
A enter {Boolean} automatikusan rögzíti a enter kulcsot, és virtuálisan kattintson a benyújtási gombra (például: false)
onclose {String} Link a funkcióhoz function(item, close) (Az opcionális
onopen {String} Link a funkcióhoz function(item, el) (Az opcionális
A autofocus {Boolean} lehetővé teszi az automatikus fókuszt az első bekapcsolásra (default: false)
NEW right {Number} jobb margin (defualt: 0)
NEW bottom {Number} alsó margin (defualt: 0)
NEW useminheight {Boolean} használja a min-height helyett a height CSS attribútum (default: false)

Jó tudni:

A cancel osztályú elemeket egy törlés gombként használják.

adatforrás:

[
	{
		// 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
	}
]

Használja a <ui-component name="formtab">Amennyiben a készülék még nem tölthető le, jComponent letöltés az első felhasználásra a címről DEF.fallback (Azt a Componentator A szerző: Peter Širka. forrás: a Componentator Az összetevők raktár, MIT licenc.

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>