Resizable GlideDialogWindow.

[Abhijit Das7]

Hi Everyone,

I am creating pop up using GlideDialogWindow. I want it to be resizable, I should be able to resize it's size using cursor.

UI Action :

function showPage() {

    var gdw;
    gdw = new GlideDialogWindow('frame_1');
   // gdw.setSize(300, 300);
    gdw.setTitle("Test");
    gdw.hideBackground();
    gdw.render();

}

UI Page :

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<div>
<iframe src="https://xyz.com" style="width: 100%; height: 100%; resize: both"></iframe> 
</div>
</j:jelly>

I am using resize property in iframe, but it is not working.

Thanks

[Satishkumar B]

To make a `GlideDialogWindow` resizable, use jQuery UI. Here's a concise guide:

UI Action:

function showPage() {
var gdw = new GlideDialogWindow('frame_1');
gdw.setTitle("Test");
gdw.setSize(300, 300);
gdw.hideBackground();
gdw.render();

setTimeout(function() {
$('#frame_1').closest('.glide_dialog_window').resizable();
}, 100);
}

UI Page:
Include jQuery UI libraries and adjust the iframe:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide">
<g:evaluate>
var $j = jQuery.noConflict();
</g:evaluate>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div>
<iframe src="https://xyz.com" style="width: 100%; height: 100%;"></iframe>
</div>
</j:jelly>

This setup makes the `GlideDialogWindow` resizable using jQuery UI.

#####################################################
If my response proves useful, please indicate its helpfulness by selecting "Accept as Solution" and " Helpful." This action benefits both the community and me.

[Abhijit Das7]

Hi @Satishkumar B 

I tried your suggestion , but it did not work. I am not able to change size using cursor.

Thanks