Page tree
Skip to end of metadata
Go to start of metadata

Version

opCharts 4.4.2

We are providing ways for customers to produce custom form schema which can be read by certain components in opCharts to show additional fields which can be configured to the users liking.

These files are stored in conf/form_schemas and are json encoded schema which will tell our form system how to render.

Currently there is no way to get dynamic data for helping drive select lists for example but this could change in the future, let us know what you want to see.


Supported opCharts Components


conf/form_schema/opCharts_demo.json
{
    "label": "Demo",
    "description": "Demo form schema",
    "component": ["element_lists"],
    "tags": ["inventory"],
    "schema": {
        "demo1": {
            "label": "My Label",
            "type": "Text"
        },
        "demo2": {
            "label": "Another Label",
            "type": "Select",
            "options": ["option1", "option2"]
        }
    }
}


Filename

The Filename must be prefixed with the application name, eg opCharts_

The filename must have .json at the end and only be a-Z 0-9 ascii characters.

Part of the filename will be saved to schema documents so changing the filename at a later date will break linkage.

Form Metadata

keytyperequireddescription
labelStringyesTitle of the form schema which will be shown in the gui
descriptionStringnoGive context to your users about what this form is for
componentarray[string]noAllow the form schema to show for different components, is an array so a form could be shared over more than one component, if this is not defined then it will show over more than type of component.
tagsarray[string]noWe use this in element_inventory to then filter down form types for different inventory, its an array so you can share this form over multiple types of inventory.
schemaobjectyesDeep structure to represent the form
schema.<key>nested keyyesDefines what the value will be saved under
schema.<key>.typestringnoDefines the type of field type to be rendered, if not defined it will default to Text
schema.<key>.titlestringnoDefines the text that appears in a form field's label
schema.<key>.helpstringnoHelp text to add next to the editor.
schema.<key>.validatorsarray[]noA list of validators, see validation below


Supported Field Types

Schema Value
Text
Number
Password
TextArea
Checkbox
Select
Radio
Date
DateTime


Validation

typedescription
requiredChecks the field has been filled in.
numberChecks it is a number, allowing a decimal point and negative values.
rangeChecks it is a number in a range defined by min and max options. Message if it is not a number can be set with the numberMessage option.
emailChecks it is a valid email address.
urlChecks it is a valid URL.
matchChecks that the field matches another. The other field name must be set in the field option.
regexpRuns a regular expression. Requires the regexp option, which takes a compiled regular expression or a string value. Setting the match option to false ensures that the regexp does NOT pass.

See Backbone Form Validation for examples and further docs.

https://github.com/powmedia/backbone-forms#validation

{
    "label": "Customer Data",
    "description": "Edit in conf/form_schemas/opCharts_element_inventory_customer.json",
    "component": ["element_lists"],
    "tags": ["interface"],
    "schema": {
        "customerId": {
            "label": "Customer ID",
            "type": "Text"
        },
        "upStream": {
            "label": "Upstream Contract Speed",
            "type": "Number",
            "validators": [
                { "type": "range", "min": 1, "max": 10000, "message": "Mbps should be between 1 and 10000" }
            ]
        },
        "downStream": {
            "label": "Downstream Contract Speed",
            "type": "Number",
            "validators": [
                { "type": "range", "min": 1, "max": 10000, "message": "Mbps should be between 1 and 10000" }
            ]
        }
    }
}