javascriptdialogoffice365office-dialog-api

Office dialog width issue when using parameter


I am using Office dialog and sending data to the dialog by parameter and I am using height and width 15 because I need a small dialog when I pass a parameter then its width automatically increases to 30.

when I am not using parameters then it works in 15 width. `

 function ErrorMesage(Errmessage) {
     let ErrorMesagedialog; // Declare as global variable.
     Office.context.ui.displayDialogAsync('https://localhost:44333/ErrorMessage/Error.html?error=' + Errmessage, { height: 15, width: 15
 },
 
  function (asyncResult) {
         ErrorMesagedialog = asyncResult.value
         ErrorMesagedialog.addEventHandler(Office.EventType.DialogMessageReceived, processMessage);
    }
);
function processMessage(arg) {
    ErrorMesagedialog.close();
}
}`

you can see this in screenshot

enter image description here


Solution

  • Outlook will try to display the entire title on the Web and the title + URL for Outlook Desktop. It will stretch the dialog as much as it can till adding ellipses. You do not have control over this area in terms of styling and how this information is displayed. The following is the official Microsoft answer to the question ... How to change the Dialog title?, where the main quote is ...

    The title of the dialog cannot be changed - this is by design. This is to prevent spoofing as the title displays the URL of the page that is loaded.

    If you looking for a solution in your particular case, you can easily shorten the displayed information, which makes the dialog width a bit smaller, by modifying the information you are trying to pass. For example, you can pass to the dialog an error number instead of the error message ...

    https://localhost:44333/ErrorMessage/Error.html?e=100
    

    Later in the dialog HTML on load event use the parameter e to retrieve the error number and display the corresponding message/description.