j-FormTab

jComponent 20 · jcomponent@20 component Παράδειγμα φορτωμένο με jComponent 20

Το συστατικό μεταφέρει το περιεχόμενο αυτού του συστατικού κάτω από την ετικέτα <body> (εξαιτίας της θέσης)
Το τμήμα αναμένει την

ΕΠΙΤΡΟΦΗ:

width {Number} πλάτος μορφής
widthlg {Number} πλάτος φόρμας για συσκευές lg (προεπιλεγμένη: config.width)
widthmd {Number} πλάτος φόρμας για συσκευές md (προεπιλεγμένη: config.width)
widthsm {Number} πλάτος φόρμας για συσκευές sm (προεπιλεγμένη: config.width)
widthxs {Number} πλάτος φόρμας για συσκευές xs (προεπιλεγμένη: config.width)
height {Number} ύψος μορφής
Υψηλότητα μορφής heightlg {Number} για συσκευές lg (προεπιλογή: config.height)
Υψηλότητα μορφής heightmd {Number} για συσκευές md (προεπιλογή: config.height)
Υψηλότητα μορφής heightsm {Number} για συσκευές sm (προεπιλογή: config.height)
Υψηλότητα μορφής heightxs {Number} για συσκευές xs (προεπιλογή: config.height)
margin {Number} ένα προεπιλεγμένο περιθώριο μεταξύ των μορφών (προεπιλογή: 10)
marginlg {Number} ένα προεπιλεγμένο περιθώριο για συσκευές lg (προεπιλογή: config.margin)
marginmd {Number} ένα προεπιλεγμένο περιθώριο για συσκευές md (προεπιλογή: config.margin)
marginsm {Number} ένα προεπιλεγμένο περιθώριο για συσκευές sm (προεπιλογή: config.margin)
marginxs {Number} ένα προεπιλεγμένο περιθώριο για συσκευές xs (προεπιλογή: config.margin)
marginfullscreen {Number} ένα προεπιλεγμένο περιθώριο για τη λειτουργία πλήρους οθόνης (προεπιλογή: 20)
marginfullscreenlg {Number} ένα προεπιλεγμένο περιθώριο πλήρους οθόνης για συσκευές lg (προεπιλογή: config.marginfullscreen)
marginfullscreenmd {Number} ένα προεπιλεγμένο περιθώριο πλήρους οθόνης για συσκευές md (προεπιλογή: config.marginfullscreen)
marginfullscreensm {Number} ένα προεπιλεγμένο περιθώριο πλήρους οθόνης για συσκευές sm (προεπιλογή: config.marginfullscreen)
marginfullscreenxs {Number} ένα προεπιλεγμένο περιθώριο πλήρους οθόνης για συσκευές xs (προεπιλογή: config.marginfullscreen)
submit {String} σύνδεση σε μια παγκόσμια λειτουργία function(meta, data, hide) και εκτελείται εάν το κουμπί υποβολής πιέζεται
Η σύνδεση cancel {String} σε μια παγκόσμια λειτουργία και εκτελείται εάν πιέζεται το κουμπί cancel
Το enter {Boolean} καταγράφει αυτόματα το κλειδί enter και πρακτικά κάνει κλικ στο κουμπί υποβολής (προεπιλεγμένο: false)
onclose {String} σύνδεση με τη λειτουργία function(item, close) (επιλεκτική)
onopen {String} σύνδεση με τη λειτουργία function(item, el) (επιλεκτική)
Το autofocus {Boolean} επιτρέπει την αυτόματη εστίαση για την πρώτη εισαγωγή (προεπιλογή: false)
NEW right {Number} δεξιά περιθώριο (απόθετο: 0)
NEW bottom {Number} κάτω περιθώριο (απόθετο: 0)
NEW useminheight {Boolean} χρησιμοποιεί min-height αντί για το χαρακτηριστικό height CSS (προεπιλεγμένο: false)

Καλό να ξέρεις:

Κάθε στοιχείο με κλάση cancel θα χρησιμοποιηθεί ως κουμπί ακύρωσης

Πηγή δεδομένων:

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

Χρησιμοποιήστε το με <ui-component name="formtab">Όταν το στοιχείο δεν έχει φορτωθεί ακόμα, jComponent Κατεβάστε το για πρώτη φορά από τη διεύθυνση DEF.fallback (Η Componentator Συγγραφέας: Peter Širka. πηγή: το Componentator Ετικέτες Αξιολόγηση, 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>