Completed
Last Updated: 25 Apr 2016 10:06 by ADMIN
Completed
Last Updated: 11 Mar 2016 14:24 by ADMIN
Completed
Last Updated: 11 Mar 2016 07:08 by ADMIN
Completed
Last Updated: 01 Apr 2016 07:04 by ADMIN
ADMIN
Created by: Marin Bratanov
Comments: 0
Category: Window
Type: Bug Report
0
To get the RadWindow to center properly, you need to use its OnClientAutoSizeEnd event and  call its center() method:

This issue affects only the Q1 2016 SP1 release.

		<script>
			function OnClientAutoSizeEnd(sender, args) {
				sender.center();
			}
		</script>
		<telerik:RadWindow ID="RadWindow1" runat="server" OpenerElementID="Button1" AutoSize="true" Modal="true" OnClientAutoSizeEnd="OnClientAutoSizeEnd">
			<ContentTemplate>
				<div style="width: 600px; height: 400px; background: yellow;">dummy content for autosizing</div>
			</ContentTemplate>
		</telerik:RadWindow>
		<asp:Button ID="Button1" Text="open RW" runat="server" />
Completed
Last Updated: 12 Mar 2016 15:20 by ADMIN
For the time being you can use the following CSS workaround:
	<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
		<style>
		html .RadWindow_Bootstrap.rwLoading .rwExternalContent {
			background-image: url('	<%= Telerik.Web.SkinRegistrar.GetWebResourceUrl(this, typeof(RadWindow), "Telerik.Web.UI.Skins.Bootstrap.Common.loading.gif") %>')
		}
	</style>
	</telerik:RadCodeBlock>
Unplanned
Last Updated: 17 Nov 2015 09:08 by ADMIN
Here is a script override that can help:

Telerik.Web.UI.Widgets.Draggable.prototype._calcConstraints = function (delta, position, constraints)
        {
            var $ = $telerik.$;
 
            var result = delta;
            //CHANGED THIS **********************************************************************************************************
            //Otherwise window can't be moved all the way to the right or bottom of screen
            //var elementWidth = this._element.offsetWidth;
            //var elementHeight = this._element.offsetHeight;
            var elementWidth = $(this._element).width();
            var elementHeight = $(this._element).height();
            //**********************************************************************************************************************
             
            if ((constraints.maxX != null && position.x + elementWidth > constraints.maxX) ||
                (constraints.minX != null && position.x < constraints.minX) ||
                (constraints.maxY != null && position.y + elementHeight > constraints.maxY) ||
                (constraints.minY != null && position.y < constraints.minY)
                )
                return { x: 0, y: 0 };
 
            if (delta.x < 0)
                result.x = constraints.minX !== null && !isNaN(constraints.minX) ?
                    Math.max(delta.x, constraints.minX - position.x) :
                    delta.x;
            else
                result.x = constraints.maxX !== null && !isNaN(constraints.maxX) ?
                    Math.min(delta.x, constraints.maxX - position.x - elementWidth) :
                    delta.x;
 
            if (delta.y < 0)
                result.y = constraints.minY !== null && !isNaN(constraints.minY) ?
                    Math.max(delta.y, constraints.minY - position.y) :
                    delta.y;
            else
                result.y = constraints.maxY !== null && !isNaN(constraints.maxY) ?
                    Math.min(delta.y, constraints.maxY - position.y - elementHeight) :
                    delta.y;
 
            return result;
        };
Completed
Last Updated: 23 Feb 2016 12:39 by ADMIN
Completed
Last Updated: 20 Oct 2015 09:46 by ADMIN
There are three possible workarounds until an official fix is available

- use RenderMode=Classic


- add a check for the object fields in the handler, in every handler

			function theCloseEventsHandler(sender, args) {
				var arg = args.get_argument();
				if (arg.target && arg.which) { //it is the mouse event
					arg = null;
				}
				alert(arg);
			}


- add the check by overriding the built-in function of the dialog. Place the following script at the end of the page that hosts the RadWindows:

			var oldClose = Telerik.Web.UI.RadWindow.prototype.close;
			Telerik.Web.UI.RadWindow.prototype.close = function (arguments) {
				if (arguments.target && arguments.which) { //it is the mouse event
					arguments = null;
				}
				var _oldClose = Function.createDelegate(this, oldClose);
				_oldClose(arguments);
			}
Completed
Last Updated: 22 Oct 2015 06:07 by ADMIN
There are two possible workarounds:

- use RenderMode=Classic
- OR, add a CSS class to the dialog and a simple CSS rule to remove the built-in font icon:
			div.withCustomIcon .rwIcon:before
			{
				content: "";
			}

			<telerik:RadWindow ID="RadWindow1" runat="server" CssClass="withCustomIcon" IconUrl="~/images/icon_16x16.png" VisibleOnPageLoad="true" RenderMode="Lightweight"></telerik:RadWindow>
Completed
Last Updated: 01 Oct 2015 13:37 by ADMIN
This causes some empty space to remain at the bottom of the dialog. Possible workarounds are:

- set the VIsibleStatusbar property of the RadWIndowManager to false, if all your RadWindows need no statusbar; or at least to the concrete instance.

- OR, use the following script that will improve hiding the status bar element and resizing the content:

oWnd = window.radopen(pageURL, winName);
//will work for classic rendermode
oWnd.set_visibleStatusbar(false);
//will work for lightweight. In classic jQuery will not throw exceptions because of the element it cannot find
$telerik.$(".rwStatusBar", oWnd.get_popupElement()).hide();
var contentElem = $telerik.$(".rwContent.rwExternalContent", oWnd.get_popupElement());
contentElem.height(contentElem.height() + 20);
Completed
Last Updated: 29 Jul 2015 06:55 by ADMIN
For the time being you can use the following workaround:

		<telerik:RadWindow ID="RadWindow1" runat="server" NavigateUrl="telerik_new-logo_thumb.png" VisibleOnPageLoad="true" RenderMode="Lightweight"></telerik:RadWindow>
		<script>
			var $W = Telerik.Web.UI.Window;
			$W.LightweightRenderer.prototype.createUI = function () {
				if (this.container) return;
				var wnd = this.window;
				var isRtl = wnd._isWindowRightToLeft();
				var addCssClass = Sys.UI.DomElement.addCssClass;

				var container = document.createElement("div");
				this._appendToDom(container);
				this.container = wnd._popupElement = container;
				container.id = "RadWindowWrapper_" + wnd.get_id();

				container.className = this._getSkinCssClass();
				var customCssClass = wnd.get_cssClass();
				if (customCssClass)
					addCssClass(container, customCssClass);
				if (isRtl)
					addCssClass(container, "rwRtl");
				if (!wnd._visibleTitlebar)
					addCssClass(container, "rwNoTitleBar");

				this.setShadowCssClass(wnd._enableShadow);

				container.setAttribute("unselectable", "on");

				var containerStyle = container.style;
				containerStyle.width = wnd._width;
				containerStyle.height = wnd._height;
				containerStyle.position = "absolute";

				var titlebar = this.titlebar = wnd._titlebarElement = document.createElement("div");
				titlebar.className = "rwTitleBar";
				container.appendChild(titlebar);

				var titleWrap = document.createElement("div");
				titleWrap.className = "rwTitleWrapper";
				titlebar.appendChild(titleWrap);

				titleWrap.appendChild(this.getIconNode());
				titleWrap.appendChild(this.getTitleNode());
				wnd.set_title(wnd._title);
				titleWrap.appendChild(this.getTitleCommandsContainer());

				wnd._registerTitlebarHandlers(true);
				wnd.set_iconUrl(wnd.get_iconUrl());

				var content = this.content = $get(wnd.get_id() + "_C") || this.pendingContent || document.createElement("div");
				if (content) {
					content.style.display = "none";
					content.className = "rwContent";
					this.setContent(content);
				}

				if (!wnd._dockMode) {
					var contentFrames = content.getElementsByTagName("iframe");
					//Create content IFRAME. Due to a bug in IE regarding setting the name attribute, the following ugly code needs to be used
					var frame = contentFrames.length > 0 ?
									contentFrames[0] :
									document.createElement(($telerik.isIE && !$telerik.isIE9Mode) ? "<iframe name='" + name + "'>" : "iframe");

					var name = this.window.get_name();

					frame.name = name;
					/*jshint scripturl:true*/
					frame.src = "javascript:'<html></html>';";
					frame.style.width = "100%";
					frame.style.height = "100%";
					frame.style.border = "0px"; //set to 0
					frame.frameBorder = "0";

					//Only under IE8 it is necessary to set display = "block" for the IFRAME - otherwise it will not occupy 100% of its parent element
					if ($telerik.isIE8)
						frame.style.display = "block";

					this.contentFrame = wnd._iframe = frame;

					//FIX for IFRAME overflowing outside the RadWindow under mobile device
					if (($telerik.isMobileSafari || wnd._isiPhoneiPadAppleWebkit) && !wnd._isPredefined) {
						var iframeWrapper = document.createElement('div');
						$(iframeWrapper).addClass('rwIframeWrapperIOS');
						iframeWrapper.appendChild(this.contentFrame);
						this.content.appendChild(iframeWrapper);
						//in iOS5 having a wrapper with only overflow hidden does not resolve the frame height problem
						//we need to have explicit pixel height for that wrapper as well !!!
						if (wnd._isiOS5Safari) wnd.setContentFixedHeight(wnd.get_height(), iframeWrapper);
						wnd._iframeWrapper = iframeWrapper;
					} else {
						this.content.appendChild(this.contentFrame);
					}

					Sys.UI.DomElement.addCssClass(this.content, "rwExternalContent");

					//Create a back reference to parent RadWindow
					wnd._createBackReference();
				}

				if (wnd._visibleStatusbar) {
					var statusbar = this.statusbar = document.createElement("div");
					statusbar.className = "rwStatusBar";
					container.appendChild(statusbar);

					statusbar.appendChild(this.getStatusMessageNode());
					if (wnd.isBehaviorEnabled(Telerik.Web.UI.WindowBehaviors.Resize))
						statusbar.appendChild(this.createStatusbarResizer());
				}


				wnd._addWindowToDocument();

				if (!$telerik.isTouchDevice) //fix various issues with the control when hardware acceleration is enabled with CSS
				{
					this.container.style["Transform"] = "none";
					this.container.style["BackfaceVisibility"] = "visible";
					this.container.style["webkitTransform"] = "none";
					this.container.style["webkitBackfaceVisibility"] = "visible";
					this.container.style["OTransform"] = "none";
					this.container.style["OBackfaceVisibility"] = "visible";
					this.container.style["MozTransform"] = "none";
					this.container.style["MozBackfaceVisibility"] = "visible";
					this.container.style["msTransform"] = "none";
					this.container.style["msBackfaceVisibility"] = "visible";
				}

				//Create the popup if it has not been created
				if (!wnd._popupBehavior) {
					//Set behaviors (move, resize,etc etc) - do it here, so that the IFRAME is created and can be passed to be skipped
					//should be done only once!
					wnd.set_behaviors(wnd._behaviors);
					this.popupBehavior = wnd._popupBehavior = $create(Telerik.Web.PopupBehavior, {
						'id': ((new Date() - 100) + 'PopupBehavior'),
						'parentElement': null, 'overlay': wnd._overlay, 'keepInScreenBounds': wnd._keepInScreenBounds
					}, null, null, this.container);
				}

			};
		</script>
Won't Fix
Last Updated: 07 Dec 2015 12:55 by ADMIN
When the Lightweight render mode is enabled and you set large text in any of the dialogs of RadWindow, part of the text appears outside of the window.

You can workaround this issue by overriding the styles of the dialogs. Below you can check a possible approach for RadAlert:
    <style type="text/css">
        div.RadWindow {
            overflow: auto;
            height: auto !important;
        }

        .rwDialogMessage {
            padding-bottom: 30px;
        }
    </style>
Unplanned
Last Updated: 24 Jun 2015 11:27 by ADMIN
The following CSS will override the built-in rules to improve the icons positioning:

            div.RadWindow_Glow .rwTable .rwTitlebarControls .rwIcon
            {
                margin: 3px 5px 0 0;
            }

            div.RadWindow_Silk .rwTable .rwTitlebarControls .rwIcon
            {
                margin: 2px 5px 0 0;
            }

            div.RadWindow_Bootstrap .rwTable .rwTitlebarControls .rwIcon
            {
                margin: 6px 5px 0 0;
            }
Won't Fix
Last Updated: 07 Jan 2016 14:07 by ADMIN
ADMIN
Created by: Danail Vasilev
Comments: 0
Category: Window
Type: Bug Report
1
As a workaround you can manually display the loading panel as per this KB - http://www.telerik.com/support/kb/aspnet-ajax/window/details/custom-loading-sign-for-radwindow
Completed
Last Updated: 09 Nov 2015 12:45 by ADMIN
There are two workarounds:
- set the EnableShadow property in the markup
- OR, for Lightweight RenderMode, add a CSS class:

<telerik:RadWindow ID="RadWindow_MyInfo" runat="server" RenderMode="Lightweight"></telerik:RadWindow>
<asp:Button ID="Button1" Text="show wnd" OnClientClick="test(); return false;" runat="server" />
<script>
	function test() {
		var myinfo = $find('<%=RadWindow_MyInfo.ClientID%>');
		myinfo.setUrl("../Dialogs/MyInfo.aspx");
		myinfo.set_enableShadow(true);
		myinfo.show();
		$telerik.$(myinfo.get_popupElement()).addClass("rwShadow");
	}
</script>
Completed
Last Updated: 29 Nov 2017 11:48 by ADMIN
The easiest workaround is to remove the overlay (e.g., set the Overlay property to false or call the set_overlay(false) client-side method). In most cases an overlay is not needed, as it is used only for showing the popup over heavyweight objects like PDFs, Flash or Java applets: http://www.telerik.com/support/kb/aspnet-ajax/window/details/control-is-shown-behind-a-heavy-weight-object-(pdf-flash-activex-etc)
Completed
Last Updated: 29 Nov 2017 15:41 by ADMIN
You can work around this by storing the currently focused element before calling autoSize()
and then using the OnClientAutoSizeEnd event (http://www.telerik.com/help/aspnet-ajax/window-client-side-events-onclientautosizeend.html) to restore the focus.

//this goes in the content
function autoSizeWnd() {
	//code that manipulates the content so autosizing is needed
	var oWnd = getRadWindow();
	if ($telerik.isIE) { //assumes you have the Telerik core client-side libraries loaded (e.g., by having a Telerik control on this page). If you don't, you can skip the check or add them manually
		oWnd.__currActElem = document.activeElement;
	}
	oWnd.autoSize();
}


//this goes in the main page where the RadWindow is declared
function autoSizeEndHandler(sender, args) {
	setTimeout(function () {
		if (sender.__currActElem && sender.__currActElem.focus) {
			sender.__currActElem.focus();
		}
	}, 0);
}
Completed
Last Updated: 26 Feb 2015 08:58 by Frank
A JavaScript error is thrown when a dialog that has animations enabled is closed if unobtrusive validation is used on the page.

Workarounds are:
- avoid animations
- OR, add the following script at the end of the form and remove it when this issue is fixed internally
Telerik.Web.UI.RadWindow.prototype._hide = function() {
	if (!this.get_animation() || this.get_animation() == 0) {
		this._afterHide();
	} else {
		if (this._enableShadow && $telerik.isIE) {
			this._setShadowCSSClass(false);
		} 
		var fnc = Function.createDelegate(this, this._afterHide),
			isMaximized = this.isMaximized(),
			duration = this.get_animationDuration();
		var popupElem = $telerik.$(this._popupElement);
		if (popupElem.length > 0 && popupElem.stopTransition) {
			$telerik.$(this._popupElement).stopTransition().transition({ opacity: 0 }, duration, "linear", function () {
				fnc(isMaximized);
			});
		} else {
			fnc(isMaximized);
		}
	}
}
Completed
Last Updated: 08 Sep 2015 07:43 by ADMIN
At present, RadWindows do not have a z-index during animations so they may get hidden behind other elements on the page.
The animation should be performed with the final z-index being already set to the RadWindow's popup element.
Completed
Last Updated: 17 Feb 2015 14:38 by ADMIN
A possible workaround is to remove the wrong skin-specific CSS class and add the correct one, for example:
<telerik:RadWindow ID="first" runat="server" Skin="Silk" Height="200px" Width="200px" VisibleOnPageLoad="true" RenderMode="Lightweight"
				   OnClientShow="applyProperSkinClass">
	<ContentTemplate>
		<asp:Label runat="server" Text="Silk"></asp:Label>
	</ContentTemplate>
</telerik:RadWindow>
<telerik:RadWindow ID="second" runat="server" Skin="MetroTouch" Height="200px" Width="200px" VisibleOnPageLoad="true" RenderMode="Lightweight"
				   OnClientShow="applyProperSkinClass">
	<ContentTemplate>
		<asp:Label runat="server" Text="MetroTouch"></asp:Label>
	</ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
	function applyProperSkinClass(sender, args) {
		var classesArray = $telerik.$(sender.get_popupElement()).attr('class').split(' ');
		for (var i = 0; i < classesArray.length; i++) {
			if (classesArray[i].indexOf("RadWindow_") > -1) {
				$telerik.$(sender.get_popupElement()).removeClass(classesArray[i]);
			}
		}
		$telerik.$(sender.get_popupElement()).addClass("RadWindow_" + sender.get_skin());
		var wndBounds = sender.getWindowBounds();
		sender.setSize(wndBounds.width, wndBounds.height);
	}
</script>