Keynote

• Plugin Properties Options allow a plugin to gather configuration data from a plugin user.
• Plugin Properties Options should be returned in the abstract method "getPropertyOptions" of each plugin.
• Plugin Properties Options are in JSON format.

Basic Properties Options Structure 

[
    {
        title : 'Page Title',
        properties : [
            {
                name : 'Property Name',
                label : 'Property Label',
                type : 'Property Type',
                required : 'Mandatory or Not', 
                //… more property attributes …
            }, //… more properties …
        ],
        validators : [
            //… properties custom validators …
        ]
    }, //… more properties page …
]

Properties Option Types

1. Hidden field - hidden
2. Read only field – readonly
3. Text field – textfield
4. Password field – password
5. Text Area field – textarea
6. HTML Editor field – htmleditor
7. Checkbox field – checkbox
8. Radio Button field – radio
9. Select Box field – selectbox
10. Multi Select Box field – multiselect
11. Element (Plugin) Select field – elementselect
12. Grid field - grid

Properties Validator Types

1. AJAX - ajax

Detail Attributes of Option Types 

Common Attributes for All Properties Options Types Except Hidden Field and Grid

{
    name : 'Property Name',
    label : 'Property Label',
    description : 'Property Description', //optional, default is NULL
    type : 'readonly',
    value : 'Property Value', //optional , default is empty string
    required : 'true', //optional, boolean value, default is false
}

Extra Attributes for Text Field, Password Field, Text Area and HTML Editor

{
    size : '50', //optional , integer value, default is NULL, only for text field and password field
    maxlength : '50', //optional, integer value, default is NULL, only for text field and password field
    rows : '50', //optional, integer value, default is NULL, only for text area and html editor
    cols : '50', //optional, integer value, default is NULL , only for text area and html editor
    regex_validation : '^

\[a-zA-Z0-9_\|a-zA-Z0-9_\]

+$', //optional, default is NULL
    validation_message : 'Error!!' //optional, default is NULL
}

Extra Attributes for Checkbox, Radio Button, Select Box and Multi Select Box, Element Select Field

{ &nbsp; &nbsp; *size* : '<span style="color: #0000ff">10</span>', <span style="color: #99cc00">//optional, integer value, default is 4,</span> <span style="color: #008000">only for multi select box</span> &nbsp; &nbsp; *options* : \[<span style="color: #99cc00">//is optional to use this attribute or options_ajax</span> &nbsp; &nbsp; &nbsp; &nbsp; {value: '<span style="color: #0000ff">value1</span>', label : '<span style="color: #0000ff">Value 1</span>'}, &nbsp; &nbsp; &nbsp; &nbsp; {value: '<span style="color: #0000ff">value2</span>', label : '<span style="color: #0000ff">Value 2</span>'}, &nbsp; &nbsp; &nbsp; &nbsp; {value: '<span style="color: #0000ff">value3</span>', label : '<span style="color: #0000ff">Value 3</span>'} &nbsp; &nbsp; \], &nbsp; &nbsp; *options_ajax_on_change* : '<span style="color: #0000ff">property1</span>', <span style="color: #99cc00">//optional, this property name and value will passed as HTTP request parameter to the URL defined in the options_ajax property</span> &nbsp; &nbsp; *options_ajax* : '<span style="color: #0000ff">URL to load options JSON</span>' <span style="color: #99cc00">//optional, URL which returns the JSON Array of a set of Objects that have value &amp; label attribute</span> }

Attributes for Hidden Field

{
    name : 'Property Name',
    type : 'hidden',
    value : 'Property Value'
}

Attributes for Grid

{     *name* : '{color:#0000ff}Property Name{color}',     *label* : '{color:#0000ff}Property Label{color}',     *description* : '{color:#0000ff}Property Description{color}', {color:#99cc00}//optional, default is NULL{color}     *type* : '{color:#ff6600}grid{color}',     *columns* : \[{color:#99cc00}// 2 type of column, with and without options attribute{color}         {*key* : '{color:#0000ff}col1{color}', *label* : '{color:#0000ff}Col 1{color}'},         {*key* : '{color:#0000ff}col2{color}', *label* : '{color:#0000ff}Col 2{color}',             *options* :\[                 {*value* :'{color:#0000ff}option1{color}', *label* : '{color:#0000ff}Option 1{color}'},                 {*value* :'{color:#0000ff}option2{color}', *label* : '{color:#0000ff}Option 2{color}'}             \]         },     \]     *value* : \[{color:#99cc00}//optional, default is NULL{color}         {col1 : 'abc', col2 : 'option1'},         {col1 : 'def', col2 : 'option2'}     \],     *required* : '{color:#0000ff}true{color}', {color:#99cc00}//optional, boolean value, default is false{color} }

Extra Attributes for Element Select Field

{
    options_ajax_on_change : 'property1', //optional, this property name and value will passed as HTTP request parameter to the URL defined in the options_ajax property
    options_ajax : '

\[CONTEXT_PATH\]

/web/property/json/getElements?classname= org.joget.apps.form.model.FormLoadElementBinder', //Load plugin list based on class name given
    url : '

\[CONTEXT_PATH\]

/web/property/json

\[APP_PATH\]

/getPropertyOptions', //Load plugin properties
    keep_value_on_change : 'true' //optional, boolean value, default is false. To keep current configuration for the next selected element
}

Detail Attributes of Validator Type

 Attributes for AJAX

{
    type : 'ajax',
    url : 'URL to validate properties page value' , // All properties in the same page will send to this url to validate, URL return a JSON Object with status (success or fail) & message (JSONArray of String) attribute
    default_error_message : 'Error in this page!!' //optional, default is null
}