ตัวเลือกคุณสมบัติปลั๊กอิน

การใช้งาน

Plugin Properties Options allow a plugin to gather configuration data from a plugin user.
ตัวเลือกคุณสมบัติปลั๊กอินควรส่งคืนใน abstract method "getPropertyOptions" ของแต่ละปลั๊กอิน.

โครงสร้าง

ตัวเลือกคุณสมบัติปลั๊กอินอยู่ในรูปแบบ JSON.
Plugin Properties Options is an array of Properties Page object
A Properties Page object has 2 mandatory attributes called "title" and "properties". It also has 2 optional attributes called "validators" and "buttons".

[
    {
        title : 'Page Title',
        properties : [
            {
                name : 'Property Name',
                label : 'Property Label',
                description : 'Property Description', //optional, default is NULL
                type : 'Property Type',
                value : 'Property Value', //optional, default is null
                required : 'Mandatory or Not', //optional, 'true' or 'false', default is 'false'
                //… more attributes …
            }, //… more fields …
        ],
        validators : [  //optional
            //… properties custom validators …
        ],
        buttons : [  //optional
            //… custom properties page buttons …
        ]
    }, //… more properties page …
]

Sample Look and Feel

ประเภทของฟิลด์

กล่องทำเครื่องหมาย (Check Box)

ประเภท : 'ตัวเลือก'
อ้างอิงถึง Option Field Attributes for extra attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Multi Values Field on how to use the value of this field type in the plugin code.

เครื่องมือแก้ไขโค้ด (Code Editor)

ปรเภท : 'แก้ไขโค้ด'
โหมด : Optional, used for specified highlight mode. Default to 'text', available values are 'text', 'java', 'html', 'javascript', 'css', 'json', 'sql' and 'xml'.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

Combine Grid

Combine Grid is used to migrate 2 or more single value property fields from old version plugin (etc Text Field & Select Box) to multi values field in Grid View.
Combine Grid does not support 'value' attribute.
ประเภท : 'GridCombine'
คอลัมน์ : A JSON array of 'column' JSON objects which has 2 mandatory 'key' & 'label' attributes and 2 optional 'required' & 'options' attribute.
- คีย์ : Identifier of this column. This value need to be same with the field 'name' that need to migrate from single value field to multiple value field.
- label : Label of the column header
- ตัวเลือก : Optional, an array of JSON object with 'value' and 'label' attributes. A column with 'options' attribute will display the input field as select box.
- required : Optional, 'true' or 'false'. A grid cell with the 'required' attribute of 'row' and 'column' set to 'true' value is a mandatory field.
```
columns : [
    {key : 'key', label : 'Columns'}, 
    {key : 'value', label : 'Value', required: 'true'},
    {key : 'label', label : 'Label', required: 'true'},
    {key : 'width', label : 'Width', options:[
        {value : '10%', label : '10%'},
        {value : '20%', label : '20%'},
        {value : '30%', label : '20%'},
        {value : '40%', label : '20%'}
    ]}
]
```
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Combine Grid Field on how to use the value of this field type in the plugin code.

Element Select Box

ประเภท : 'ElementSelect'
url : A URL which will return Properties Options JSON object of the selected element. Built-in URL is "[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions" which will return the Properties Options JSON object of a plugin.
keep_value_on_change : Optional, 'true' or 'false'. Used to decide whether to keep the configuration of the properties options of previous selected element when a new element is selected.
อ้างอิงถึง Option Field Attributes for extra attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
Usually used for select a plugin and configure the properties of the selected plugin.
อ้างอิงถึง Retrieve Properties Value in Plugin - ElementSelectBox on how to use the value of this field type in the plugin code.

ไฟล์

ประเภท : 'ไฟล์',
appPath : '[APP_PATH]',
allowInput : Optional, 'true' or 'false'. Set to 'true' to allow custom link.
isPublic : Optional, 'true' or 'false'. Set to 'true' to auto set the permission to access by anonymous.
allowType : Optional, a string of file extension seperated (;). Example: ".jpeg;.jpg;.gif;.png".
ขนาดสูงสุด : Optional, integer value in string format. In kB.
อ้างอิงถึง Regular Express (Regex) Validation Attributes for extra attributes to do validation using regex.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

Fixed Row Grid

ประเภท : 'GridFixedRow'
คอลัมน์ : A JSON array of 'column' JSON objects which has 2 mandatory 'key' & 'label' attributes and 2 optional 'required' & 'options' attribute.
- คีย์ : Identifier of this column.
- label : Label of the column header
- ตัวเลือก : Optional, an array of JSON object with 'value' and 'label' attributes. A column with 'options' attribute will display the input field as select box.
- required : Optional, 'true' or 'false'. A grid cell with the 'required' attribute of 'row' and 'column' set to 'true' value is a mandatory field.
แถว : A JSON array of 'row' JSON Object with 'label' attribute and an optional 'required' attribute. A grid cell with the 'required' attribute of 'row' and 'column' set to 'true' value is a mandatory field.
- label : Label of a row. Used to populate in the first column or every row.
- required : Optional, 'true' or 'false'. A grid cell with the 'required' attribute of 'row' and 'column' set to 'true' value is a mandatory field.
ค่า : A JSON array of grid row values in JSON Object format with all the 'key' attribute of 'column' object used as attribute.

columns : [
    {key : 'key', label : 'Columns'}, // first column will used to populate row label
    {key : 'value', label : 'Value', required: 'true'},
    {key : 'label', label : 'Label', required: 'true'},
    {key : 'width', label : 'Width', options:[
        {value : '10%', label : '10%'},
        {value : '20%', label : '20%'},
        {value : '30%', label : '20%'},
        {value : '40%', label : '20%'}
    ]}
],
rows : [
    {label : 'Username', required: 'true'},
    {label : 'Status'},
    {label : 'Message'},
    {label : 'Date'}
],
value : [
    {label : 'Username'},
    {label : 'Status'},
    {label : 'Message', width : '20%'},
    {label : 'Date', value : 'dateCreated'}
]

อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Grid Field on how to use the value of this field type in the plugin code.

Grid

ประเภท : 'Grid'
คอลัมน์ : A JSON array of 'column' JSON objects which has 2 mandatory 'key' & 'label' attributes and 2 optional 'required' & 'options' attribute.
- คีย์ : Identifier of this column.
- label : Label of the column header
- ตัวเลือก : Optional, an array of JSON object with 'value' and 'label' attributes. A column with 'options' attribute will display the input field as select box.
- required : Optional, 'true' or 'false'. A grid cell with the 'required' attribute of 'row' and 'column' set to 'true' value is a mandatory field.

ค่า : A JSON array of grid row values in JSON Object format with all the 'key' attribute of 'column' object used as attribute.

columns : [
    {key : 'value', label : 'Value', required: 'true'},
    {key : 'label', label : 'Label', required: 'true'},
    {key : 'width', label : 'Width', options:[
        {value : '10%', label : '10%'},
        {value : '20%', label : '20%'},
        {value : '30%', label : '20%'},
        {value : '40%', label : '20%'}
    ]}
],
value : [
    {label : 'Username', value : 'username'},
    {label : 'Status', value : 'status'},
    {label : 'Message', value : 'message', width : '20%'},
    {label : 'Date', value : 'dateCreated'}
]

อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Grid Field on how to use the value of this field type in the plugin code.

ส่วนหัว

ประเภท : 'ส่วนหัว'
Header does not support 'value' and 'required' attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
This field type is used for separate the fields into different groups. It is not use for capture data.

ฟิลด์ซ่อน (Hidden Field)

ประเภท : 'ซ่อน'
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

HTML Editor

ประเภท : 'HtmlEditor'
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

ภาพ

ประเภท : 'file',
appPath : '[APP_PATH]',
allowInput : Optional, 'true' or 'false'. Set to 'true' to allow custom link.
isPublic : Optional, 'true' or 'false'. Set to 'true' to auto set the permission to access by anonymous.
allowType : Optional, a string of file extension seperated (;). Example: ".jpeg;.jpg;.gif;.png".
ขนาดสูงสุด : Optional, integer value in string format. In kB.
ขนาดภาพ : Optional, can be integer value in string format or a css expression. Example: '50' or "width:100px;height:70px;".
อ้างอิงถึง Regular Express (Regex) Validation Attributes for extra attributes to do validation using regex.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

Label

ประเภท : 'Label'
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

Multi Select Box

ประเภท : 'MultiSelect'
อ้างอิงถึง Option Field Attributes for extra attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Multi Values Field on how to use the value of this field type in the plugin code.

ฟิลด์รหัสผ่าน (Password Field)

ประเภท : 'รหัสผ่าน'
ขนาด : Optional, integer value in string format. Default to '50'. Used to control the length of the input field.
ความยาวสูงสุด : Optional, integer value in string format. Used to limit the number of characters can be enter in the input field.
อ้างอิงถึง Regular Express (Regex) Validation Attributes for extra attributes to do validation using regex.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

ปุ่มตัวเลือก (Radio Button)

ประเภท : 'ตัวเลือก'
อ้างอิงถึง Option Field Attributes for extra attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

ฟิลด์ข้อความแบบอ่านอย่างเดียว (Readonly Text Field)

ประเภท : 'อ่านอย่างเดียว'
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

กล่องตัวเลือก (Select Box)

ประเภท : 'ตัวเลือก'
อ้างอิงถึง Option Field Attributes for extra attributes.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

พื้นที่ข้อความ (Text Area)

ประเภท : 'พื้นที่ข้อความ'
แถว : Optional, integer value in string format. Default to '5'. Used to control the height of the input field.
คอลัมน์ : Optional, integer value in string format. Default to '50'. Used to control the length of the input field.
อ้างอิงถึง Regular Express (Regex) Validation Attributes for extra attributes to do validation using regex.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

ฟิลด์ข้อความ (Text Field)

ประเภท : 'ฟิลด์ข้อความ'
ขนาด : Optional, integer value in string format. Default to '50'. Used to control the length of the input field.
ความยาวสูงสุด : Optional, integer value in string format. Used to limit the number of characters can be enter in the input field.
อ้างอิงถึง Regular Express (Regex) Validation Attributes for extra attributes to do validation using regex.
อ้างอิงถึง Dependency Field Attributes for extra attributes to do show/hide this field based on other field value.
อ้างอิงถึง Retrieve Properties Value in Plugin - Single Value Field on how to use the value of this field type in the plugin code.

Regular Express (Regex) Validation Attributes

The following attributes are designed for Password Field, Text Area and Text Field.
regex_validation : Optional, regular express in string format.
validation_message : Optional, error message to display when validation failure.

{
    regex_validation : '^[a-zA-Z0-9_]+$',
    validation_message : 'Invalid ID!!'
}

Dependency Field Attributes

The following attributes are available for all field types.
These attributes are used to show/hide a field based on the value of another field.
The value of a field hidden by these attributes will be ignore during save.
control_field : Optional, 'name' of another field used to control the show/hide of current field.
control_value : Optional, value or regular expression (regex) in string format. This value need to match the value of the controlling field in order to make the field visible.
control_use_regex : Optional, 'true' or 'false'. Default to 'false'. Set to 'true' to use regular expression (regex) in matching the value.

{
    control_field: 'chartType',
    control_value: 'bar|xy|area|bubble|line|candlestick|ohlc',
    control_use_regex: 'true',
}

Options Field Attributes

The following attributes are designed for options fields like Check Box, Element Select Box, Multi Select Box, Radio Button and Select Box.
You can choose to use one of the following attributes "options", "options_ajax", "options_callback" or "options_script" to populate the options for the field.
options : Optional, an array of JSON object with 'value' and 'label' attributes.

options : [
    {value: 'value1', label : 'Value 1'},
    {value: 'value2', label : 'Value 2'},
    {value: 'value3', label : 'Value 3'}
]

options_ajax : Optional, a URL which will return an array of JSON object with 'value' and 'label' attributes.

options_ajax : '[CONTEXT_PATH]/web/json/console/app[APP_PATH]/datalist/options'

options_ajax_on_change : Optional, name of a property field. Used together with 'options_ajax' attribute. The field name and its value will passed as HTTP request parameter to the URL.

options_ajax_on_change : 'type'
options_ajax : '[CONTEXT_PATH]/web/json/app[APP_PATH]/plugin/org.joget.plugin.enterprise.SamplePlugin/service?action=getJson'

options_callback : Optional, a javascript function name. All attributes in the field will passed as a single JSON object parameter to this function. The function should return an array of JSON object with 'value' and 'label' attributes.

options_callback: 'DatalistBuilder.getColumnOptions'

options_script : Optional, a string of javascript which will return an array of JSON object with 'value' and 'label' attributes.

options_script: 'var tempArray = [{\'label\':\'\',\'value\':\'\'}]; 
for(ee in DatalistBuilder.availableColumns){ var temp = {
\'label\' : UI.escapeHTML(DatalistBuilder.availableColumns[ee].label),
\'value\' : DatalistBuilder.availableColumns[ee].id}; 
tempArray.push(temp);}tempArray;'

Built-in JSON API for 'options_ajax'

[CONTEXT_PATH]/web/json/console/app[APP_PATH]/forms/options
Return all available forms of current app.
[CONTEXT_PATH]/web/json/console/app[APP_PATH]/datalist/options
Return all available datalists of current app.
[CONTEXT_PATH]/web/json/console/app[APP_PATH]/userview/options
Return all available userviews of current app.
[CONTEXT_PATH]/web/property/json/getElements?classname={plugin interface/abstract class name, optional}
Return all available plugins based on the classname filter.
[CONTEXT_PATH]/web/json/console/app[APP_PATH]/form/columns/options?formDefId={Form Def Id, optional}&tableName={Form Data tabel name, optional}&tables={Additional form data tables name seperated by (;), optional}&fields={Additional fields to add to result seperated by (;), optional}
Return all available fields from form data table

Built-in Javascript Function for 'options_callback'

DatalistBuilder.getColumnOptions(properties)
Can be used by plugins related to Datalist Builder. It return all available columns based on binder configuration.

Validator Types

Page validator is execute during change page.
All fields data in the same page will pass to the validator for validation.

AJAX

Call to a URL for validation.
type : 'AJAX'
url : An URL return a JSON Object with status (success or fail) & message (JSONArray of String) attribute
default_error_message : Optional. A string of error message.

Page Button

Page button can be added on the bottom of each page to provide extra feature. Such as send an test email to test the email configuration or make a test connection to database.
Page button will collect the required fields data from the page and popup dialog and call an AJAX URL.
name : Identifier of this button.
label : Label of the button.
ajax_url : A URL to execute the button action. The URL should return a JSON Object with message (String) attribute.
fields : An array of fields name in the same page that will be used by this button.
addition_fields : An array of Property Field JSON object that will be shown in a popup dialog to collect extra data.

Example:

buttons : [{
    name : 'testmail',    
    label : 'Send Test Email',
    ajax_url : '[CONTEXT_PATH]/web/json/app[APP_PATH]/plugin/org.joget.apps.app.lib.EmailTool/service?action=testmail',
    fields : ['host', 'port', 'security', 'username', 'password'],
    addition_fields : [
        {
            name : 'from',
            label : 'From',
            type : 'textfield',
            required : 'True'
        },
        {
            name : 'toSpecific',
            label : 'To',
            type : 'textfield',
            required : 'True'
        }
    ]
}]

Variable

[CONTEXT_PATH]

This variable will be replaced by Context Path of current URL.
Usually used in property attribute value which is URL
Example : '[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormValidator'
Resulted URL : '/jw/web/property/json/getElements?classname=org.joget.apps.form.model.FormValidator'

[APP_PATH]

This variable will be replaced by Current App Id and App Version of current URL.
Usually used in property attribute value which is URL
Example : '[CONTEXT_PATH]/web/json/console/app[APP_PATH]/datalist/options'
Resulted URL : '/jw/web/json/console/app/crm/3/datalist/options'

Retrieve Properties Value in Plugin

All the plugin must extends the "org.joget.plugin.base.ExtDefaultPlugin" abstract class. We can use the "Object getProperty(String)" and "String getPropertyString(String)" method to retrieve the configured properties.

Single Value Field

String value = getPropertyString("property_name");

Multi Values Field

String[] values = getPropertyString("property_name").split(";");

Combine Grid Field

String[] col1_values = getPropertyString("col1_name").split(";");
String[] col2_values = getPropertyString("col2_name").split(";");

Grid Field

Object columns = getProperty("property_name");
if (columns != null) {
    for (Object colObj : (Object[]) columns) {
        Map col = (Map) colObj;
        String col1_value = (String) opt.get("col1_key");
        String col2_value = (String) opt.get("col2_key");
    }
}

Element Select Box

import org.joget.plugin.base.PluginManager;
import org.joget.apps.app.service.AppUtil;
import org.joget.plugin.base.ExtDefaultPlugin;
 
Object element = getProperty("property_name");
if (element != null && element instanceof Map) {
    Map elementMap = (Map) element;
    String className = (String) elementMap.get("className");
    Map<String, Object> properties = (Map<String, Object>) elementMap.get("properties");
 
    //convert it to plugin
    PluginManager pm = (PluginManager) AppUtil.getApplicationContext().getBean("pluginManager");
    ExtDefaultPlugin plugin = (ExtDefaultPlugin) pm.getPlugin(className);
    if (plugin != null) {
        plugin.setProperties(properties);
    }
}

Page tree

ตัวเลือกคุณสมบัติปลั๊กอิน

การใช้งาน

โครงสร้าง

Sample Look and Feel

ประเภทของฟิลด์

กล่องทำเครื่องหมาย (Check Box)

เครื่องมือแก้ไขโค้ด (Code Editor)

Combine Grid

Element Select Box

ไฟล์

Fixed Row Grid

Grid

ส่วนหัว

ฟิลด์ซ่อน (Hidden Field)

HTML Editor

ภาพ

Label

Multi Select Box

ฟิลด์รหัสผ่าน (Password Field)

ปุ่มตัวเลือก (Radio Button)

ฟิลด์ข้อความแบบอ่านอย่างเดียว (Readonly Text Field)

กล่องตัวเลือก (Select Box)

พื้นที่ข้อความ (Text Area)

ฟิลด์ข้อความ (Text Field)

Regular Express (Regex) Validation Attributes

Dependency Field Attributes

Options Field Attributes

Built-in JSON API for 'options_ajax'

Built-in Javascript Function for 'options_callback'

Validator Types

AJAX

Page Button

Variable

[CONTEXT_PATH]

[APP_PATH]

Retrieve Properties Value in Plugin

Single Value Field

Multi Values Field

Combine Grid Field

Grid Field

Element Select Box