Hi All,
I am creating two dialogs: a parent and its child.
Parent has size 1082x630
Child has size 1500x900
On parent dialog, when I click on button "Show Child Dialog", its child will be shown.
The problem here is the size of child dialog larger than its parent. So, I want to resize the size of child dialog and show it in the center of its parent dialog.
And here is my code in Javascript that I use for resizing child dialog manually. To center child dialog, I also use childRadWindow.left and BUT, it does not work as my expected. The child dialog does not place in the center of its parent.
Please reference my expected, actual images and my code to get the problem.
My expected result: https://drive.google.com/file/d/0B7thkzS9kbhkY1ZMcW9LNGdCZ0E/view?usp=sharing
Actual result: https://drive.google.com/file/d/0B7thkzS9kbhkLU9nLVA2LVU0TDg/view?usp=sharing
Here is my code to resize child dialog manually. I put it on child dialog *.
<script type=
"text/javascript"
>
$(document).ready(
function
() {
resizeRWndDialog();
});
</script>
function
resizeRWndDialog() {
var
radWindows = [];
var
radWindow = GetRadWindow();
while
(
true
) {
if
(radWindow != undefined && radWindow !=
null
) {
radWindows.push(radWindow._popupElement);
radWindow = radWindow.BrowserWindow.GetRadWindow();
}
else
{
break
;
}
}
var
numsOfRadWindow = radWindows.length - 1;
if
(numsOfRadWindow > 0) {
for
(
var
i = numsOfRadWindow; i > 0; i--) {
var
parentWindow = radWindows[i];
var
parentWidth = parentWindow.clientWidth;
//parentWidth =1082
var
parentHeight = parentWindow.clientHeight;
//parentHeight = 630
var
chidWindow = radWindows[i - 1];
var
childWidth = chidWindow.clientWidth;
//childWidth = 1500
var
childHeight = chidWindow.clientHeight;
//childHeight = 900
var
rateMinWidth = 0,
rateMinHeight = 0,
rateMaxWidth = 0,
rateMaxHeight = 0;
if
(chidWindow.style.minWidth !=
""
) {
rateMinWidth = parseInt(chidWindow.style.minWidth) / childWidth;
}
if
(chidWindow.style.minHeight !=
""
) {
rateMinHeight = parseInt(chidWindow.style.minHeight) / childHeight;
}
if
(chidWindow.style.maxWidth !=
""
) {
rateMaxWidth = parseInt(chidWindow.style.maxWidth) / childWidth;
}
if
(chidWindow.style.maxHeight !=
""
) {
rateMaxHeight = parseInt(chidWindow.style.maxHeight) / childHeight;
}
if
((parentWidth - 40) > 0 && childWidth >= parentWidth - 40) {
childWidth = parentWidth - 40;
//parentWidth = 1082, childWidth = 1042
}
if
((parentHeight - 80) > 0 && childHeight >= parentHeight - 80) {
childHeight = parentHeight - 80;
//parentHeight = 630, childHeight = 550
}
setSizeRWndDialog(chidWindow.getElementsByClassName(
"rwTable"
)[0], rateMinWidth * childWidth, rateMinHeight * childHeight, rateMaxWidth * childWidth, rateMaxHeight * childHeight, childWidth, childHeight);
setSizeRWndDialog(chidWindow, rateMinWidth * childWidth, rateMinHeight * childHeight, rateMaxWidth * childWidth, rateMaxHeight * childHeight, childWidth, childHeight);
chidWindow.left = Math.round((parentWidth - childWidth) / 2, 0) +
"px"
;
chidWindow.top = Math.round((parentHeight - childHeight) / 2, 0) +
"px"
;
chidWindow.focus();
radWindows[i - 1] = chidWindow;
}
}
}
function
setSizeRWndDialog(element, minWidth, minHeight, maxWidth, maxHeight, width, height) {
if
(minWidth != 0 && minHeight != 0) {
element.style.minWidth = minWidth +
"px"
;
element.style.minHeight = minHeight +
"px"
;
}
if
(maxWidth != 0 && maxHeight != 0) {
element.style.maxWidth = maxWidth +
"px"
;
element.style.maxHeight = maxHeight +
"px"
;
}
else
{
element.style.maxWidth = width +
"px"
;
element.style.maxHeight = height +
"px"
;
}
element.style.width = width +
"px"
;
element.style.height = height +
"px"
;
}