j-Textbox

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

ΕΠΙΤΡΟΦΗ:

type {String} (Επιλεκτικά) Μπορεί να email, phone, password, date, number, search, lower, upper ή κενό (αποκαλούμενη)
Το required {Boolean} (επιλεγμένο) επιτρέπει το «αναγκαίο» (προσδιορισμός: false)
icon {String} (επιλεγμένη) εικονική για ετικέτα, π.χ. home, cog, κλπ.
icon2 {String} (επιλεγμένη) εικονική στο δεξί πλαίσιο κ.λπ. home, cogκλπ
label {String} (επιλεγμένη) ετικέτα (προσδιορισμός είναι το περιεχόμενο HTML)
autofocus {Boolean} (επιλεκτικά) επικεντρώνεται στην εισαγωγή (προσδιορισμός: false)
align {String} (επιλεγμένη) left (προεπιλογή), right ή center
Το autofill {Boolean} (επιλεγμένο) επιτρέπει την αυτοδιαγραφή του προγράμματος περιήγησης (προσδιορισμός: false)
placeholder {String} (επιλεκτικά) προσθέτει ένα κείμενο placeholder στην εισαγωγή
maxlength {Number} (επιλεκτικά) καθορίζει το μέγιστο μήκος των φορτηγών
minlength {Number} (επιλεκτικά) καθορίζει ένα ελάχιστο μήκος των φορτηγών
validation {String} (επιλεκτική) προϋπόθεση για evaluation π.χ. value.match(/[a-z]+/) !== null
format {String} (επιλεκτική) μορφοποίηση εξόδου για τις ημερομηνίες (προσδιορισμός: yyyy-MM-dd)
increment {Boolean} (επιλεκτικά) επιτρέπει τον έλεγχο για την αύξηση των αριθμών (προσδιορισμός: false)
Το keypress {Boolean} (επιλεγμένο) μπορεί να απενεργοποιήσει τις δεσμευτικές τιμές σε πραγματικό χρόνο (προεπιλογή: true)
delay {Number} (επιλεκτικά) μπορεί να αυξήσει / μειώσει την καθυστέρηση για τη σύνδεση σε πραγματικό χρόνο (προσδιορισμός: 300 ms)
disabled {Boolean} (επιλεκτικά) απενεργοποιεί αυτό το συστατικό
error {String} (επιλεκτικά) προσθέτει κείμενο string κάτω από την εισαγωγή
Το iconclick {String} (επιλεγμένο) πρέπει να περιέχει μια σύνδεση με μια λειτουργία
Το autocomplete {String} (επιλεγμένο) πρέπει να περιέχει μια σύνδεση με μια λειτουργία, εκκινείται στο γεγονός focus
spaces {Boolean} (επιλεκτικά) επιτρέπει χώρους διαφορετικά τα αφαιρεί (προσδιορισμός: true)
readonly {Boolean} Εναλλακτικά, προαιρετικά false
NEW innerlabel {Boolean} προαιρετική, επιτρέπει την εσωτερική ετικέτα (προεπιλεγμένη: true)

Ενδιαφέροντα :

Το type:date χρησιμοποιεί το συστατικό calendar.

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

example.html

<div style="width:400px">
	<ui-component name="textbox" path="form.name" config="required:true;placeholder:Your name;icon2:pencil;error:Please enter your name">Name</ui-component>
	<br />
	<ui-component name="textbox" path="form.email" config="required:true;type:email;autofill:email;icon:envelope;error:E-mail must be in format email@domain.com">E-mail</ui-component>
	<br />
	<ui-component name="textbox" path="form.password" config="type:password">Password</ui-component>
	<br />
	<ui-component name="textbox" path="form.note">Note</ui-component>
	<br />
	<ui-component name="textbox" path="form.phone" config="type:phone">Phone</ui-component>
	<br />
	<ui-component name="textbox" path="form.age" config="type:number;increment:true">Age</ui-component>
	<br />
	<ui-component name="textbox" path="form.search" config="type:search">Search</ui-component>
	<hr />
	<h2>Inner label</h2>
	<ui-component name="textbox" path="form.name" config="required:true;innerlabel:true;placeholder:Your name;icon2:pencil;error:Please enter your name">Name</ui-component>
</div>

<script>
	var form = {};
	form.email = '@';
	form.age = 30;
</script>