Web Component: j-Configuration
j-Configuration
- easy usage
- supports dark mode
Configuration:
dateformat {String}
a default date format (default:DEF.dateformat
)
Declaration
Allowed properties:
type {String}
supports:string
number
date
boolean
dropdown
color
icon
multiline
selectable
text {String}
a text/titlename {String}
a name of property in the modelalign {Number}
align for inputs (0
left (default),1
center,2
right)icon {String}
optional, Total JS or font-awesome icon identifiersummary {String}
optional, a summarizationnote {String}
optional, a noterequired {Boolean}
optional, is the property required?disable {String}
optional, declaration of arrow function in the formmodel => model.interval === 100
visible {String}
optional, declaration of arrow function in the formmodel => model.interval === 100
button {String}
optional, creates a small buttonclick {String}
optional, a link to the method (depends on thebutton
)maxlength {Number}
optional, supports onlystring
typemin {Number}
optional, supports onlynumber
typemax {Number}
optional, supports onlynumber
typeincrement {Number}
optional, an increment count - supports onlynumber
type (default:1
)multiple {Boolean}
optional, works withselectable
type (a value will be array)monospace {Boolean}
optional, works withstring
andnumber
typesbold {Boolean}
optional, works withstring
andnumber
typesplaceholder {String}
optionalitems {String/Object Array}
optional fordropdown
andselectable
in the form[{ id: 'VALUE', name: 'TEXT' }]
- type
string
a path to theObject Array
(works with scopes) - type
Object Array
fixed defined array
- type
dirplaceholder {String}
optional, placeholder forj-Directory
dirsearch {Boolean}
optional, enables/disablessearch
field inj-Directory
(default:true
)- NEW:
datasource {String}
optional, a path to the data-source for config items
Declaration must be defined in the component's element body wrapped in the <script type="text/plain">
element. Example:
[
{
name: 'My group label',
type: 'group',
// summary: 'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Numquam, nostrum.',
// icon: 'ti ti-home'
},
{
id: 'name',
name: 'Application name',
type: 'string',
icon: 'ti ti-home',
disable: 'model => model.interval < 100',
summary: 'Lorem, ipsum dolor sit amet consectetur, adipisicing elit. Iste eos, illum voluptas assumenda sunt possimus necessitatibus nobis provident dicta deserunt.',
required: true
},
... other items
]
Author
- Peter Širka petersirka@gmail.com
- License
Created
16. june 2021
Updated
27. july 2023
Version
v1
License
https://www.totaljs.com/license/
Dark mode
Yes
Responsive
Yes
Author
Peter Širka
Email
petersirka@gmail.com
