Dialog API in Office JS Development.

This article contains some of the issues that I face during implement dialogs in office js adding development project and solutions for that.

1. Open dialog in office js

To open dialog in office js you need to use Office.context.ui.displayDialogAsync function. you need to parse the dialog url width and height in percentage to this.

2. Parse data from dialog to current host.

To this we need to use Office.context.ui.messageParent function.

After that need to add event handler to receive this message in the parent form.

3. Parse data between parent to dialog form

You can parse data data between parent to dialog form easily by appending the data with dialog url.

4. Open second dialog form in office js

In Office js there cannot be more than one dialog open from a given host page, so to open another dialog we need to close the current dialog before calling displayDialogAsync to open another dialog.

1. First Dialog implementation (DlgElement Dialog)

2. Second Dialog Implementation (DlgInsertElement Dialog)

In this you need to ensure that first form is close before opening the second dialog so that you need to add recursive call to ensure that dialog is closed.

Thank you. Happy Coding!!!