getolympus / olympus-text-field
Text field, this component is a part of the Olympus Dionysos fields.
Installs: 484
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 2
Forks: 0
Open Issues: 0
Type:olympus-field
Requires (Dev)
- phpunit/phpunit: ~5.3
README
Dionysos Text Field
This component is a part of the Olympus Dionysos fields for WordPress.
It uses the default WordPress text field to display password, range, text, datetime, tel, and more fields.
composer require getolympus/olympus-dionysos-field-text
Table of contents
Field initialization • Variables definition • Settings definition • Retrive data • Release History • Contributing
Field initialization
Use the following lines to add a text field
in your WordPress admin pages or custom post type meta fields:
return \GetOlympus\Dionysos\Field\Text::build('my_text_field_id', [ 'title' => 'What do you like?', 'default' => 'Penguins, I am sure they\'re gonna dominate the World!', 'description' => 'Put in here everything you want.', 'placeholder' => 'McDonald\'s as well', 'type' => 'text', /** * Settings definition * @see the `Settings definition` section below */ 'settings' => [], ]);
Variables definition
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
title |
String | 'Text' |
empty |
default |
String | empty | empty |
description |
String | empty | empty |
placeholder |
String | empty | empty |
type |
String | 'text' |
see Accepted type |
settings |
Array | see Field initialization | see Settings definition |
Accepted type
date
see Date typedatetime-local
see Datetime-local typeemail
see Email typehidden
see Hidden typemonth
see Month typenumber
see Number typepassword
see Password typerange
see Range typesearch
see Search typetel
see Tel typetext
see Text typetime
see Time typeurl
see URL typeweek
see Week type
Settings definition
The settings
variable is an array of options depending on type
value.
In all cases, here are the default settings with their explanations:
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
attrs |
String | empty | empty |
after |
String | empty | empty |
before |
String | empty | empty |
class |
String | empty | empty |
readonly |
Boolean | false |
true or false |
- Special case:
attrs
will let you add all additional attributes you need, such asdata-*
. Pay attention to this! after
will insert contents after the field. Innumber
andrange
cases, theafter
content will prepend themax
valuebefore
will insert contents before the field. Innumber
andrange
cases, thebefore
content will append themin
valueclass
will add CSS classes to the already-inregular-text
field class (not used inhidden
case)readonly
will avoid the field to be used when its value is set totrue
Date type
Full documentation on Mozilla Date page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Date | empty | latest date to accept in yyyy-MM-dd format |
min |
Date | empty | earliest date to accept in yyyy-MM-dd format |
step |
Integer | empty | integer, to read as day |
Datetime-local type
Full documentation on Mozilla Datetime-local page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Date | empty | latest date to accept in yyyy-MM-ddThh:mm format |
min |
Date | empty | earliest date to accept in yyyy-MM-ddThh:mm format |
step |
Integer | empty | integer, to read as second |
Email type
Full documentation on Mozilla Email page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
multiple |
Boolean | false |
true or false |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
spellcheck |
Boolean | false |
true or false |
Hidden type
Full documentation on Mozilla Hidden page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
display |
Boolean | false |
true or false |
This special display
variable defines if the hidden field have to show field value or not:
- set to
false
, a sentence will show where the value is stored in Database - set to
true
, a sentence will show where the value is stored in Database and what is the current value
Month type
Full documentation on Mozilla Month page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Date | empty | latest date to accept in yyyy-MM format |
min |
Date | empty | earliest date to accept in yyyy-MM format |
step |
Integer | empty | integer, to read as month |
Number type
Full documentation on Mozilla Number page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Float | empty | empty |
min |
Float | empty | empty |
step |
Float | empty | empty |
Password type
Full documentation on Mozilla Password page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
Range type
Full documentation on Mozilla Range page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
datalist |
Array | empty | list of suggestions users can pick to automatically fill the control's value |
max |
Float | empty | empty |
min |
Float | empty | empty |
step |
Float | empty | empty |
This range
type will display an input number
HTML tag with the field value.
Search type
Full documentation on Mozilla Search page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
spellcheck |
Boolean | false |
true or false |
Tel type
Full documentation on Mozilla Tel page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
Text type
Full documentation on Mozilla Text page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
spellcheck |
Boolean | false |
true or false |
Time type
Full documentation on Mozilla Time page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Date | empty | latest time to accept in hh:mm or hh:mm:ss format |
min |
Date | empty | earliest time to accept in hh:mm or hh:mm:ss format |
step |
Integer | empty | integer, to read as second |
When the step
variable is provided, browser will add the seconds input area adjacent to the minutes section.
The max
and min
variables format will automatically be forced to hh:mm:ss
.
URL type
Full documentation on Mozilla URL page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
datalist |
Array | empty | list of suggestions users can pick to automatically fill the control's value |
maxlength |
Integer | empty | empty |
minlength |
Integer | empty | empty |
pattern |
String | empty | javascript regular expression |
size |
Integer | empty | empty |
spellcheck |
Boolean | false |
true or false |
Week type
Full documentation on Mozilla Week page
Variable | Type | Default value if not set | Accepted values |
---|---|---|---|
max |
Date | empty | latest time to accept in yyyy-Www format |
min |
Date | empty | earliest time to accept in yyyy-Www format |
step |
Integer | empty | integer, to read as 1week |
Retrive data
Retrieve your value from Database with a simple get_option('my_text_field_id', '')
(see WordPress reference):
// Get text from Database $text = get_option('my_text_field_id', ''); // Display text echo $text;
Release History
Version | Note |
---|---|
0.0.23 | Fix jQuery integration on domReady |
0.0.22 | Change main DIV id to avoid HTML conflicts for labels |
0.0.21 | Enable datalist suggestions for range type |
Contributing
- Fork it (https://github.com/GetOlympus/olympus-dionysos-field-text/fork)
- Create your feature branch (
git checkout -b feature/fooBar
) - Commit your changes (
git commit -am 'Add some fooBar'
) - Push to the branch (
git push origin feature/fooBar
) - Create a new Pull Request
Built with ♥ by Achraf Chouk ~ (c) since a long time.