GlideDialogWindow setSize and removeCloseDecoration on Fuji

kenny_vl1 · ‎11-02-2015

An onLoad catalog client script was created, which calls a dialog window.

function onLoad() {
   var dialog = new GlideDialogWindow("sc_cat_item_disclamer"); //create "Terms and Conditions" dialog window
   dialog.setTitle(getMessage('disclamer_title')); //Set the dialog title
   dialog.setSize(600,600); //Set the dialog size
   dialog.removeCloseDecoration(); //remove the close cross from the dialogwindow
   dialog.render(); //Open the dialog
}

I included the setSize method for future compatibility with Fuji.

In Eureka, I don't see the 'CloseDecoration' and the sizes are set as defined in the script. Just as expected.

In Fuji environment I am seeing the CloseDecoration and only the width is being adjusted according to the setSize. The height does not change. This is not at all what I expected.

It seems that the removeCloseDecoration is not working and neither is the height parameter from the setSize method.

function onLoad() {
   var dialog = new GlideDialogWindow("sc_cat_item_disclamer"); //create "Terms and Conditions" dialog window
   dialog.setTitle(getMessage('disclamer_title')); //Set the dialog title
   //dialog.setSize(600,600); //Set the dialog size
   dialog.setWidth(600); //Set the dialog width
   dialog.setHeight(600); //Set the dialog height
   dialog.removeCloseDecoration(); //remove the close cross from the dialogwindow
   dialog.render(); //Open the dialog
}

I have tried splitting up the width and height methods for testing purposes, but now the dialog window just keeps loadin and doesn't render.

When I remove the height, the dialog window renders fine.

Has anyone else already experienced similar behaviour? I am thinking this could very well be a bug in Fuji.

ChrisBurks · ‎11-03-2015

The ui_multiline_input_field is a textarea element. Whether using ServiceNow or any webpage it needs to have a size setting placed on it. By default a textarea element renders in a fixed sized. Unlike a div it doesn't change its size based on the text content within it. The size has to be set or scripted to dynamically grow.

So you have to take that into consideration when using a textarea in combination with a table element. Although a set size is placed on a table the cells within a table by default grows in size based on it's content. If a textarea is the only element used within a table cell then the table cell's size is based on the textarea's dimensions. And it's default padding and margin properties. All elements have a default padding and margin size.

If you're on Eureka I would try leveraging some of the bootstrap styling that the ServiceNow platform provides. Or try displaying your text in the table cell without the ui_multiline_input_field.

Tables are an easy way to organize the display but since bootstrap is on the platform there are more modern ways to get a nice visual display.

I hope that helps.

View solution in original post

kenny_vl1 · ‎11-02-2015

It only changes width for me , not height

As you can see, it isn't showing all text:

I understand and agree that when I am granted administrative privileges on my computer, I am still bound by policies.

In particular, I agree that:


-   I will not install software without having the appropriate licenses for it

-   I will not install software that breaches company security (e.g. malware)

-   I will only install software that is required for my function and that I am authorized to do so by my management

-   Support by the servicedesk on my computer will be limited and best effort only

-   The servicedesk will not support my locally installed software

-   It may be necessary to complete rebuild my computer to bring it back to working order, whether caused by my locally installed software or any other reason.


This will require my approval before being executed. Without this approval, no further support will be provided.


If I approve this, then I am solely responsible for re-installing my locally installed software.

Kalaiarasan Pus · ‎11-02-2015

Can you just remove the setSize line and check?

kenny_vl1 · ‎11-02-2015

I had tried that but then I am presented with -what I believe to be- the default pop-up size

Kalaiarasan Pus · ‎11-02-2015

Are you adding the content dynamically on the page? May be like clicking a checkbox?

Can you the paste the script of the page so that I can verify?

kenny_vl1 · ‎11-02-2015

No, it's just being called using the onload catalog client script from my first post. It makes use of UI messages, but that's all.

I presume you are talking about the UI page?

<g:ui_form>

   <!-- Set up form fields and labels -->

   <table width="100%">

       <tr>

           <td>

               <!-- Get 'disclamer_sub_title' to use as label and 'disclamer_terms' from UI messages to use as text -->

               <g:ui_multiline_input_field rows="20" readonly="true" name="dial_comments" id="dial_comments" label="${gs.getMessage('disclamer_sub_title')}" value="${gs.getMessage('disclamer_terms')}" mandatory="true" />

           </td>

       </tr>

       <tr id="dialog_buttons">

               <td colspan="2" align="right">

                   <!-- Pull in 'dialog_buttons_ok_cancel' UI Macro for submit/cancel buttons.

                   'ok' option will call the 'validateComments' Client script function from the UI Page-->

<g:dialog_button onclick="history.go(-1);return false;" name="cancel_button" id="cancel_button">${gs.getMessage('disclamer_reject')}</g:dialog_button>

<g:dialog_button onclick="return validateComments()" name="ok_button" id="accept_button">${gs.getMessage('disclamer_accept')}</g:dialog_button>

               </td>

       </tr>

   </table>

</g:ui_form>