function DialogHelper.showDialog()
Signature
function showDialog(dialogId: string, elements: ContentElementDeclaration[], options): Promise<object>
Type
Exported function of the xd-dialog-helper
module
Paramters
dialogId: string
The dialog id. Must be unique when showing the dialog. Gets used to prefix element ids. Important element ids are:
[dialogId]
: The dialog element itself[dialogId]-dialogHelperBtnOk
: The Submit button[dialogId]-dialogHelperBtnCancel
: The Cancel button
elements?: ContentElementDeclaration[] = []
(optional)
A list of content element declarations (ContentElementDeclaration
) which will get displayed in their order in the array as dialog content. The ids determine the value key in the return value.
options?: object = {}
(optional)
Options for the dialog like custom CSS, texts etc.
options.okButtonText?: string = 'Ok'
(optional)
The text in the "ok" button (e.g., "ok", "insert" or similar)
option.cancelButtonText?: string = 'Cancel'
(optional)
The text in the "cancel" button (e.g., "cancel", "abort" or similar)
css?: string = ''
(optional)
CSS code that gets injected into the style
width?: number = 360
(optional)
The dialog width in px
onBeforeShow?: (dialogElement: HTMLDialogElement, elements: ContentElement[], actions: ActionList): void
A function that gets triggered before the dialog gets shown. You can – for example – inject custom code here.
Parameters:
dialogElement: HTMLDialogElement
– The dialog element that gets shownelements: ContentElement[]
– The dialog's elements in a key-value based manner (the key corresponds to the name of an input) – seeContentElement
actions: ActionList
– Actions which can get performed like closing or canceling the dialog – seeActionList
onValidate?: (values: object): boolean
A function that gets triggered when inputs change. Its return value determines if the inputs are value and thus, if the ok button is clickable
Paramters:
values: object
The dialog values in a key-value-pair form (as an object), in the same format as the showDialog() return value.
Returns:
boolean
– true
if the values are valid, false
if they're not
Returns
Type: Promise<object>
A promise that
- resolves with an object containing the form values of the dialog in an object in key-value-pair form.
For example, for a dialog containing a text field with the id
'name'
, the resulting object will look like this:{ name: 'Entered name' }
- rejects with
'reasonCancelled'
if the user cancels the dialog