Dialog window using ui page

[Community Alums]

Hi,

I have created slush bucket by using ui action button whenever i am clicking on ui action button pop up window ui page get display its ui page size is not proper what i expected i want it should be proper in proper size and width.

can you help me to code for html 

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<TABLE BORDER="0">
<TR>
<TD>
Please select the user you wish to add as approvers.
</TD>
</TR>
<TR>
<TD>
<!-- Include the 'ui_slushbucket' UI macro -->
<g:ui_slushbucket/>
</TD>
</TR>
<TR>
<TD align="right">
<!-- Include the 'dialog_buttons_ok_cancel' UI macro -->
<g:dialog_buttons_ok_cancel ok="return continueOK()" cancel="return continueCancel()" ok_type="button" cancel_type="button"/>
</TD>
</TR>
</TABLE>
</j:jelly> 

[Sri Harsha3 · Accepted solution]

Hi,

I have did the similar feature recently, as per my knowledge you need to handle it dynamically using client script section in UI Page. Below is my snippet which will increase the width and margins 

Hope this helps you for further proceeding. To increase the dialog pop up size you can find the ID/Class of the div element and add CSS accordingly.

$$('.glide-list')[1].style.margin = "0 0 0 160px";
	$$('.glide-list')[1].style.position = "absolute";
	$$('.glide-list')[0].select('select')[0].style = 'max-width: 500px';
	$$('.glide-list')[1].select('select')[0].style = 'max-width: 500px';
	var varName = 'slush';
	var width = '330'; //Optional
	
	//Get the left and right bucket input elements
	var leftBucket = $(varName + '_left');
	var rightBucket = $(varName + '_right');
	//form-group
	//If the element exists
	if(leftBucket){
		//Adjust the bucket height (default is 300px)
		if(width){
			//Adjust the bucket width (default is 340px)
			leftBucket.style.width = width + 'px';
			rightBucket.style.width = width + 'px';
			rightBucket.style = 'width: 330px; float: right; position: absolute;';
		}
		
	}

[Community Alums]

Hi sri thanks for quick response now its look perfect for slush bucket but how to increase width of ui page so then it will look perfect 

kindly help me

[Community Alums]

hey sri thanks now i got it...its working perfect thanks....................

[Sri Harsha3]

Can you try by passing the div element id/class of the popup like below in the slush bucket script

$$('div#id/.class').style.wdith = "100px";