Modal
areas: content, footer
A popup container, presenting the user with a modal dialog.
The Modal has a content
and a footer
content area. The default footer
area is the Ok
and Cancel
buttons; defining a footer
area overwrites these buttons.
To open the modal, invoke a modal method.
Block
Methods
onClick:
- id: toggleOpen
type: CallMethod
params:
blockId: block_id
method: toggleOpen
onClick:
- id: setOpen
type: CallMethod
params:
blockId: block_id
method: setOpen
args:
- open: true
Block Setup
id: block_id
type: Modal
Settings
Modal JSON Schema Definition
type: object
properties:
events:
additionalProperties: false
properties:
onCancel:
description: Trigger actions when Cancel button is clicked.
type: array
onClose:
description: Trigger actions after onOk or onCancel is completed.
type: array
onOk:
description: Trigger actions when Ok button is clicked.
type: array
onOpen:
description: Trigger actions when modal is opened.
type: array
type: object
properties:
additionalProperties: false
properties:
bodyStyle:
description: Css style to applied to modal body.
type: object
cancelButtonProps:
description: Set additional properties for the cancel button.
type: object
cancelText:
default: Cancel
description: Text of the Cancel button.
type: string
centered:
default: false
description: Center the modal vertically.
type: boolean
closable:
default: true
description: >-
Whether a close (x) button is visible on top right of the modal dialog
or not.
type: boolean
footer:
default: true
description: Show footer area.
type: boolean
mask:
default: true
description: Whether show mask or not.
type: boolean
maskClosable:
default: true
description: >-
Whether to close the modal dialog when the mask (area outside the modal)
is clicked.
type: boolean
maskStyle:
description: Css style to applied to modal mask.
type: object
okButtonProps:
description: Set additional properties for the ok button.
type: object
okText:
default: Ok
description: Text of the Ok button.
type: string
title:
description: The modal dialog's title - supports html.
type: string
width:
default: 520px
description: Width of the modal dialog.
type:
- string
- number
wrapperStyle:
description: Css style to applied to modal wrapper.
type: object
zIndex:
default: 1000
description: >-
The z-index of the modal. Useful when displaying two modals
simultaneously.
type: integer
type: object