'
+ ) : tagHTML;
};
// if there is no `canContain` or `cannotContain`, then the element is not a container.
@@ -261,388 +264,426 @@ me.decorateField = function(field, tagHTML){
// && (!y.canBeContainedBy || x in y.canBeContainedBy)
me.elementTypes = {
- 'page': {
- cannotContain: ['page'],
- render: function(el){}
- },
-
- 'section': {
- cannotContain: ['page'],
- isTab : false,
- render: function(el, values, isTabs){
- return (
- '' +
- (el.label ? '
' + t(el.label) + '
' : '') +
- (el.description ? '
' + el.description + '
' : '') +
- '
' +
- me.render_fields(el, values) +
- '
' +
- ''
- );
- }
- },
-
- // todo: allow for pre-rendered markup for the description, or other renderers (such as markdown)
- 'fieldset': {
- cannotContain: ['section', 'page'],
- render: function(el, values){
- if(!el.label) el.label = el.legend;
- return (
- ''
- );
- }
- },
-
- // special .. might also be used as a container (i.e., depending on what radio is active, elements 'under' it are active?)
- // special - have to share ids .. are part of a set - TODO - allow for more than one radio group (already done?)
- 'radios': { // it's a container because radios must belong to a 'set' .. also, sometimes a form uses radios kindof like tabs....
- canContain: ['option'],
- render: function(field, values){
- return me.elementTypes.fieldset.render(field, values);
- }
- },
-
- // special .. might also be used as a container (i.e., depending on whether a checkbox is checked, elements 'under' it are active?)
- 'checkboxes': {
- canContain: ['option'],
- render: function(field, values){
- return me.elementTypes.fieldset.render(field, values);
- }
- },
-
- 'select': { // it's a container because it contains options
- canContain: ['options','optgroup'],
- render: function(field, value){
-
- var tagOutput = '';
-
- var options = typeof field.options === 'function' ? field.options() : field.options;
-
- if(field.optgroups){
- field.optgroups.forEach(function(optgroup){
- tagOutput += '';
- });
- } else {
- options.forEach(function(option){
- tagOutput += me.elementTypes.option.render(option, value, 'select');
- });
- }
- tagOutput += '';
-
- return me.decorateField(field, tagOutput);
- }
- },
-
- 'optgroup': {
- canBeContainedBy: ['select'],
- canContain: ['option']
- },
-
- 'options': {
- canBeContainedBy: ['select'],
- canContain: ['option']
- },
-
- // an "option" can be an '
- );
- } else {
- return me.defaultTagRenderer(option, value);
- }
- }
- },
-
- // type: 'radio' should become type: option, and be in a {type: radios}
- 'radio': {
- render: me.defaultTagRenderer
- },
-
- // type: 'checkbox' should become type: option, and be in a {type: checkboxes}
- 'checkbox': {
- render: function(field, value, bare) {
-
- // Quickly flip values to true/false if on/off
- value = (value === "on" ? true : (value === "off" ? false : value));
-
- // Now set the checked variable
- var checked = (value ? true : (field.value ? true : (field.checked ? true : false)));
-
- var tagOutput = "";
-
- if(!field.readonly && !field.disabled){
- // Workaround for readonly/disabled fields (esp. checkboxes/radios) - add a hidden field with the value
- tagOutput += '';
- }
-
- tagOutput += '';
- }
- return bare ? tagOutput : me.decorateField(field, tagOutput);
- }
- },
-
- 'text': {
- render: me.defaultTagRenderer
- },
-
- 'textarea': {
- render: function(field, value){
- return me.decorateField(field, ''
- + value
- + '');
- }
- },
-
- 'hidden': {
- render: me.defaultTagRenderer
- },
-
- 'password': { // can be special, if there is a 'verify'
- render: me.defaultTagRenderer
- },
-
- // might allow file to take a url
- 'file': {
- render: me.defaultTagRenderer
- },
-
- 'buttons': {
- canContain: ['submit','image','reset','button','link']
- },
-
- // buttons should only be able to be added to the 'action set'
- // button can be [submit, reset, cancel (a link), button (generic), link (generic)]
- // if form has pages, 'previous' and 'next' buttons should interpolate until the last page, 'submit'
- 'button': {
- render: me.defaultTagRenderer
- },
-
- 'submit': {
- render: me.defaultTagRenderer
- },
-
- 'image': {
- render: me.defaultTagRenderer
- },
-
- 'reset': {
- render: me.defaultTagRenderer
- },
-
- // a link is not really a form control, but is provided here for convenience
- // it also doesn't really make sense for it to have a value.
- // a link should have an href and text, and optionally, cls ('class'), id
- 'link': {
- render: function(field, value){
- var id = field.id || field.name;
- var text = field.text || field.value;
- return '' + text + '';
- }
- },
-
- 'readonlytext': {
- render: function(field, value, bare){
- var id = field.id || field.name;
- var text = field.text || field.value;
- var tagOutput = '