Thursday, July 10, 2008

AjaxToolKit 1.0.20229.0 ModalPopUp Extender IE 7.0 UI issues

Hi All,
AjaxToolKit version 1.0.20229.0 ModalPopUpExtender has some issues like it won't work in IE 7.0 . When Modal PopUP is shown it disturbed the whole UI of Page. I got fix for it for which just download the AjaxTool kit source code DownLoad Source Code and modify with following files with given code.

1. IE 7.0 UI Issue. (i.e UI was getting totally disturbed after populating the Modal pup )
File Name: Common.js
Location: AjaxControlToolkit\Common\Common.js
Function: getClientBounds



Replace the switch statement with the following one:

switch(Sys.Browser.agent) {case Sys.Browser.InternetExplorer:if (document.documentElement && document.documentElement.clientWidth)clientWidth = document.documentElement.clientWidth;else if (document.body)clientWidth = document.body.clientWidth;//clientWidth = document.documentElement.clientWidth;if (document.documentElement && document.documentElement.clientHeight)clientHeight = document.documentElement.clientHeight;else if (document.body)clientHeight = document.body.clientHeight;//clientHeight = document.documentElement.clientHeight;break;case Sys.Browser.Safari:clientWidth = window.innerWidth;clientHeight = window.innerHeight;break;case Sys.Browser.Opera:clientWidth = Math.min(window.innerWidth, document.body.clientWidth);clientHeight = Math.min(window.innerHeight, document.body.clientHeight);break;default: // Sys.Browser.Firefox, etc.clientWidth = Math.min(window.innerWidth, document.documentElement.clientWidth);clientHeight = Math.min(window.innerHeight, document.documentElement.clientHeight);break;}


2. IE 7.0 issue Modal Pop up Position was not absolute
File Name: ModalPopupBehavior.js
Location: AjaxControlToolkit\ModalPopupExtender\ModalPopupBehavior.js
Function: initialize
(Line number might be 113 )
a. Check for this statement this._backgroundElement.style.position = 'fixed';change it to thisthis._backgroundElement.style.position = 'absolute';//'fixed';
b. A few lines below that is another change that has to be made from: (Line number 125 )this._foregroundElement.style.position = 'fixed';
to:
this._foregroundElement.style.position = 'absolute';//'fixed';


Now build the AJAXtoolKit solution use its newly created dll instead of old one.
Now you will see the IE 7.0 UI issue got resolved.


But there is still one more Issue that is with IE 6.0 Flickering of background that I have resolved ine my next post please see my Next post


2 comments:

Rafael Bueno said...

Many Thanks! That Article help me a lot!!! Tks!

Sandeepya said...

Nice to see it help out some one