Page History

...

[
    {
        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

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

...

{
    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 : '^

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

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

...

..to be continue..

...

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

...

Wiki Markup

{ &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, value of this property name will passed over to load options from ajax</span> &nbsp; &nbsp; *options_ajax* : '<span style="color: #0000ff">URL to load options JSON</span>' <span style="color: #99cc00">//optional, URL return 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

...

Wiki Markup

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