Row-set widget

The row-set widget contains other rich-media items. This widget places each of these items in a separate row, so that they are separated horizontally when displayed.

Example

Properties

Property

Description

Data type

id

Unique identifier of this widget.

string

rows

Array of row rich media-widgets, which can each contain one or more other rich-media types.

string

spaceAround

Array of values for top , right, bottom, and left padding, in pixels.

string

type Rich-media type, which is always RowSet. string

Row properties

Property

Description

Data type

items

Array of rich-media widgets in this row.

integer

spaceAround

Array of values for top , right, bottom, and left padding, in pixels.

string

Code sample

 var obj = {
    "widgetType": "form",
    "constants": [{
            "name": "payment1",
            "value": "123"
        }
    ],
    "nodes":
    [{
            "id": "widget1",
            "controls": {
                "0": {
                    "type": "RowSet",
                    "rows": [{
                            "type": "Row",
                            "items": [{
                                    "type": "Heading",
                                    "text": "This is heading",
                                    "context": {
                                        "itemBackground": "#d6d6d6"
                                    },
                                    "level": 2
                                }
                            ]
                        }, {
                            "type": "Row",
                            "spaceAround": [10, 50, 0, 50],
                            "items": [{
                                    "type": "ColumnSet",
                                    "containerSpace": 5,
                                    "context": {
                                        "itemBackground": "#d6d6d6"
                                    },
                                    "id": "set1",
                                    "columns": [{
                                            "type": "Column",
                                            "id": "col1",
                                            "width": 7,
                                            "spaceAround": [0, 5, 0, 0],
                                            "items": [{
                                                    "type": "Paragraph",
                                                    "text": "Payment Details:",
                                                    "context": {
                                                        "textAlign": "right"
                                                    }
                                                }
                                            ]
                                        }, {
                                            "type": "Column",
                                            "id": "col1",
                                            "width": 5,
                                            "spaceAround": [0, 0, 0, 5],
                                            "items": [{
                                                    "type": "Heading",
                                                    "text": "{#payment1}",
                                                    "level": 3,
                                                    "context": {
                                                        "textAlign": "left"
                                                    }
                                                }
                                            ]
                                        }

                                    ]
                                }
                            ]
                        }
                    ]
                }
            }
        }
    ]
}