ForgeComponents
en

Components

j-Parameters

jComponent 20 · jcomponent@20 component Example loaded with jComponent 20

This component can changed internal parameters.


Configuration:

  • dateformat {String} optional, a date format (default: yyyy-MM-dd)
  • search {String} optional, placeholder for search input (default: Search)
  • height {Number} optional, a height of the element (default: undefined)
  • parent {String} optional, jQuery selector for auto setup of height (can be window, parent or custom)
  • hidetype {Boolean} optional, hides type (default: false)
  • margin {Number} optional, vertical margin (default: 0)

Data declaration:

var form = [];
form.push({ name: 'user.firstname', label: 'First name', type: 'string', value: 'Peter Sirka' });
form.push({ name: 'user.age', type: 'number', value: 33, min: 18, max: 50 });
form.push({ name: 'user.birth', type: 'date', value: NOW });
form.push({ name: 'user.newsletter', type: 'boolean', value: true });

Allowed types in data:

  • string
  • boolean
  • number
  • date

Use it with <ui-component name="parameters">. When the component is not loaded yet, jComponent downloads it on first use from the address in DEF.fallback (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.

example.html
<ui-component name="parameters" path="form" config="height:200"></ui-component>

<script>
	var form = [];
	form.push({ name: 'user.firstname', type: 'string', value: 'Peter' });
	form.push({ name: 'user.lastname', type: 'string', placeholder: 'String' });
	form.push({ name: 'user.age', type: 'number', value: 33 });
	form.push({ name: 'user.birth', type: 'date', value: NOW });
	form.push({ name: 'user.newsletter', type: 'boolean', value: true });
</script>