Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • dataModel - Model containing values to be displayed in the template.
Overridable Methods
formatData

...

Flag to indicate whether or not the current logged in user is authorized to view this field in the form.

It used property key "permission" to retrieve Form Permission plugin.

Utility Methods
getChildren

...

Retrieve form data rows for an array of specified primary key values.

Plugin

...

Properties Options

  • The following are some mandatory properties and system predefined properties can be used in your Plugin Properties Options JSON file. Please refer to Plugin Properties Options for more information.

Mandatory Property

Predefined Property  

Tutorials

  • Not available right now

Related Community Plugins

id 

    • All Form Element Field must has this property appear in the Properties Options JSON.
    • This is used as unique identifier of a field in a form.  
Code Block
languagejs
    {
        name : 'id',
        label : '@@form.textfield.id@@',
        type : 'textfield',
        required : 'True',
        regex_validation : '^[a-zA-Z0-9_]+$',
        validation_message : '@@form.textfield.invalidId@@'
    }

Predefined Property  

loadBinder

  • If this property appear in the Properties Options JSON, admin user is able to choose a Form Load Binder.
  • The value of this property will auto convert into Form Load Binder Plugin and the plugin can be retrieved by getLoadBinder method. 
Code Block
    {
        name:'loadBinder',
        label:'@@form.subform.loadBinder@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormLoadElementBinder',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions',
        value:'org.joget.apps.form.lib.WorkflowFormBinder',
        required:'True'
    }

optionsBinder

  • If this property appear in the Properties Options JSON, admin user is able to choose a Form Options Binder.
  • The value of this property will auto convert into Form Options Binder Plugin and the plugin can be retrieved by getOptionsBinder method.

Code Block
    {
        name : 'optionsBinder',
        label : '@@form.checkbox.chooseOptionsBinder@@',
        type : 'elementselect',
        options_ajax : '[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormLoadOptionsBinder',
        url : '[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

permission

  • If this property appear in the Properties Options JSON, admin user is able to choose a Form Permission.
  • The value of this property will auto convert into Form Permission Plugin and the plugin is used by isAuthorize method.
Code Block
    {
        name:'permission',
        label:'@@form.form.permission@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormPermission',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

storeBinder

  • If this property appear in the Properties Options JSON, admin user is able to choose a Form Store Binder.
  • The value of this property will auto convert into Form Store Binder Plugin and the plugin can be retrieved by getSoreBinder method.
Code Block
    {
        name:'storeBinder',
        label:'@@form.form.storeBinder@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormStoreElementBinder',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

readonly

  • System use this property to flag a field a readonly. 
  • If this property appear in the Properties Options JSON, admin user can force this field to display as readonly.
  • This value is ignored if the parent form is set to readonly
Code Block
    {
        name : 'readonly',
        label : '@@form.checkbox.readonly@@',
        type : 'checkbox',
        value : 'false',
        options : [{
            value : 'true',
            label : ''
        }]
    }

readonlyLabel

  • System use this property to flag a field a readonly field should display as label or not. 
  • If this property appear in the Properties Options JSON, admin user can force this field to display as label when it is readonly.
  • This value is ignored if the parent form is set to display as label when it is readonly
Code Block
    {
        name : 'readonlyLabel',
        label : '@@form.checkbox.readonlyLabel@@',
        type : 'checkbox',
        value : 'false',
        options : [{
            value : 'true',
            label : ''
        }]
    }

workflowVariable

  • If this property appear in the Properties Options JSON, admin user is set to store this field value to a workflow variable.
  • The value of this field will auto set to the mentioned workflow variable if the Form Store Binder is set to Workflow Form Binder.
Code Block
    {
        name : 'workflowVariable',
        label : '@@form.checkbox.workflowVariable@@',
        type : 'textfield'
    }

value

  • If this property appear in the Properties Options JSON, admin user is able to set a default value for this field.
Code Block
    {
        name : 'value',
        description : '@@form.checkbox.value.desc@@',
        label : 'Default @@form.checkbox.value@@',
        type : 'textfield'
    }
validator
  • If this property appear in the Properties Options JSON, admin user is able to choose a Form Validator.
  • The value of this property will auto convert into Form Validator Plugin and the plugin can be retrieved by getValidator method. 

Form Field Element Template Sample

Following is a sample Form Field Template of a Text Field element. It is constructed using FreeMaker syntax. This template will be used and returned by renderTemplate method.

Code Block
languagejava
    @Override
    public String renderTemplate(FormData formData, Map dataModel) {
        String templateName = "textField.ftl";

        // set value
        String value = FormUtil.getElementPropertyValue(this, formData);
        dataModel.put("value", value);

        String html = FormUtil.generateElementHtml(this, formData, templateName, dataModel);
        return html;
    }

  

Code Block
languagexml
<div class="form-cell" ${elementMetaData!}>
    <label class="label">
        ${element.properties.label} <span class="form-cell-validator">${decoration}</span>
        <#if error??>
            <span class="form-error-message">${error}</span>
        </#if>
    </label>
    <#if (element.properties.readonly! == 'true' && element.properties.readonlyLabel! == 'true') >
        <div class="form-cell-value"><span>${value!?html}</span></div>
        <input id="${elementParamName!}" name="${elementParamName!}" type="hidden" value="${value!?html}" />
    <#else>
        <input id="${elementParamName!}" name="${elementParamName!}" type="text" size="${element.properties.size!}" value="${value!?html}" maxlength="${element.properties.maxlength!}" <#if error??>class="form-error-cell"</#if> <#if element.properties.readonly! == 'true'>readonly</#if> />
    </#if>
</div>

Explanations

    • A form field element template should be wrapped under a div with "form-cell" class.
    • ${elementMetaData!} need to put in the ".form-cell" div. It is used by Form Builder.

    • A useable field element template must handle the following states of a field. 
      • Has errors
      • Readonly
      • Readonly and needed to display as label
      • Normal display

Tutorials

Related Community Plugins

  • Check Box
    org.joget.apps.form.lib.CheckBox (wflow-core)
  • Custom HTML
    org.joget.apps.form.lib.CustomHTML (wflow-core)
  • Date Picker
    org.joget.apps.form.lib.DatePicker (wflow-core)
  • File Upload
    org.joget.apps.form.lib.FileUpload (wflow-core)
  • Grid
    org.joget.apps.form.lib.Grid (wflow-core)
  • Hidden Field
    org.joget.apps.form.lib.HiddenField (wflow-core)
  • Id Generator Field
    org.joget.apps.form.lib.IdGeneratorField (wflow-core)
  • Password Field
    org.joget.apps.form.lib.PasswordField (wflow-core)
  • Radio Button
    org.joget.apps.form.lib.Radio (wflow-core)
  • Select Box
    org.joget.apps.form.lib.SelectBox (wflow-core)
  • Subform
    org.joget.apps.form.lib.SubForm (wflow-core)
  • Text Area
    org.joget.apps.form.lib.TextArea (wflow-core)
  • Text Field
    org.joget.apps.form.lib.TextField (wflow-core)Not available right now