Completed
Last Updated: 21 Jun 2022 09:54 by ADMIN
Move the dialog after scrolling to the bottom and its content scrolls either a bit, or to the top (depending on the used browser).
 The scroll position must be preserved and unchanged by the RadWindow control, regardless of the circumstances
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: 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>
Completed
Last Updated: 28 Jun 2016 10:39 by ADMIN
Created by: luc bonenfant
Comments: 1
Category: Window
Type: Feature Request
1
Allow adding buttons near cancel button rather than inside form. Please see attachments.
Completed
Last Updated: 20 Jun 2022 14:57 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: 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>
Completed
Last Updated: 11 Mar 2016 14:24 by ADMIN
Completed
Last Updated: 31 May 2021 09:06 by ADMIN
I'd like to send JSON (or string) object to RadWindow to be able to populate its content with  this object.
Similar to Value RadNotification property: public string Value { get; set; }

Code snippet below illustrates what I'd like to achieve.


function showWindow(jsonObject) {
    var windowManager = GetRadWindowManager();
    if (windowManager) {
        var window = windowManager.getWindowByName("RadWindow1");

        if (window != null) {
            window.DynamicContent = jsonObject; //Set content
            window.show();
        }
    }
    return;
}

function RadWindow1_Show(sender, args) {
    var jsonObject = sender.DynamicContent;

    if (jsonObject != null) {
        var selector = null;

        selector = 'span[id*="Content"]';
        var domElements = $telerik.$(selector);
        if (domElements != null && domElements.length > 0) {
            var spanId = domElements.attr('id');
            var span = $get(spanId);
            if (span != null)
                span.innerHTML = message;
        }
    }

    return;
}
Completed
Last Updated: 10 May 2017 22:03 by Vasssek
To remove the built-in icon for the Lightweight mode, add the following CSS rules to your page:

			div.rwDialog.rwAlertDialog:before
			{
				content: "";
			}

			div.rwDialog.rwConfirmDialog:before
			{
				content: "";
			}
Completed
Last Updated: 21 Apr 2017 14:10 by ADMIN
This is caused by <button> elements without a type attribute. Workarounds are

- add a JS function like this

Sys.Application.add_load(function () {
    // Add the "type=button" attribute to the RadWindow buttons so they don't try to submit the form.
    $("div.rwDialogButtons button").attr("type", "button");
});

 - OR, override the templates and add the attribute:

			<asp:TextBox ID="Textbox1" runat="server" />
			<telerik:RadWindowManager ID="rwm1" runat="server" RenderMode="Lightweight">
				<AlertTemplate>
					<div class="rwDialog rwAlertDialog">
						<div class="rwDialogContent">
							<div class="rwDialogMessage">{1}</div>
						</div>
						<div class="rwDialogButtons">
							<button type="button" class="rwOkBtn" onclick="$find('{0}').close(true); return false;">##LOC[OK]##</button>
						</div>
					</div>
				</AlertTemplate>
				<PromptTemplate>
					<div class="rwDialog rwPromptDialog">
						<div class="rwDialogContent">
							<div class="rwDialogMessage">{1}</div>
							<div class="rwPromptInputContainer">
								<script type="text/javascript">
									function RadWindowprompt_detectenter(id, ev, input) {
										if (!ev) ev = window.event;
										if (ev.keyCode == 13) {
											var but = input.parentNode.parentNode.parentNode.getElementsByTagName("button")[0];
											if (but) {
												if (but.click) {
													but.click();
												}
												else if (but.onclick) {
													but.focus();
													var click = but.onclick;
													but.onclick = null;
													if (click) click.call(but);
												}
											}
											return false;
										}
										else return true;
									}
								</script>
								<input title="Enter Value" onkeydown="return RadWindowprompt_detectenter('{0}', event, this);" type="text" class="rwPromptInput radPreventDecorate" value="{2}" />
							</div>
						</div>
						<div class="rwDialogButtons">
							<button type="button" class="rwOkBtn" onclick="$find('{0}').close(this.parentNode.parentNode.getElementsByTagName('input')[0].value); return false;">##LOC[OK]##</button>
							<button type="button" class="rwCancelBtn" onclick="$find('{0}').close(null); return false;">##LOC[Cancel]##</button>
						</div>
					</div>
				</PromptTemplate>
				<ConfirmTemplate>
					<div class="rwDialog rwConfirmDialog">
						<div class="rwDialogContent">
							<div class="rwDialogMessage">{1}</div>
						</div>
						<div class="rwDialogButtons">
							<button type="button" class="rwOkBtn" onclick="$find('{0}').close(true); return false;">##LOC[OK]##</button>
							<button type="button" class="rwCancelBtn" onclick="$find('{0}').close(false); return false;">##LOC[Cancel]##</button>
						</div>
					</div>
				</ConfirmTemplate>
			</telerik:RadWindowManager>
Unplanned
Last Updated: 20 Apr 2017 13:22 by Tom
Scenario description and workaround follow. Note the comments in the workaround and test before using, because it introduces some other unwanted behaviors, mostly related to the bottom/right edge of the zone.
       
WORKAROUND 1:

     <div id="zone" style="width: 600px; height: 500px; background: yellow;"></div>
            <telerik:RadWindow runat="server" ID="rw1" RenderMode="Lightweight" VisibleOnPageLoad="true" Left="0" Top="0" RestrictionZoneID="zone"></telerik:RadWindow>
            <script>
                Telerik.Web.UI.Window.LightweightView.prototype._resizingHandler = function(resizable, args){
                    $telerik.cancelRawEvent(args.get_domEvent());

                    var edges = this.restrictBounds,
                        bounds = this._getResizeBounds(args),
                        borders = this.resizeHelper.borders,
                        fullBounds = {
                            x: bounds.x - borders.left,//originally, subtract
                            y: bounds.y - borders.top,//originally, subtract
                            width: bounds.width + borders.horizontal,
                            height: bounds.height + borders.vertical};
                    //debugger
                    //console.log(fullBounds);
                    //changing the direction in which borders are counted above (+ or -) changes the behavior and the potential issues
                    //if you subtract from the position, resizing will not be available next to the top/left border of the restriction zone
                    //if you add to the position, resizing will be available but the user can resize in the direction of the zone bounds and thus, out of the bounds of the zone, so dragging may become unavailable
                    //also, this will make resizing worse when the window touches the right or bottom of the zone
                    var inContainer = this.window._checkRestrictionZoneBounds(edges, fullBounds);
                    
                    bounds.width = Math.max(resizable.options.constraints.minWidth, bounds.width);
                    bounds.height = Math.max(resizable.options.constraints.minHeight, bounds.height);

                    args.set_cancel(true);
                    if(inContainer && this.touchCount++ > 0)
                    {
                        var style = this.ui.container.style;
                        style.left = bounds.x + "px";
                        style.top = bounds.y + "px";
                        this._setWidth(bounds.width);
                        this._setHeight(bounds.height);

                        this._currentResizeBounds = bounds;
                    }
                }
            </script>

WORKAROUND 2:
Add this to the resizeEnd and dragEnd events of the RadWindow to try and have it never touch the sides of the restriction zone at all.

				function keepThisWindowInBounds(sender) {
					if (!sender.isMinimized() && !sender.isMaximized()) {
						var position = sender.getWindowBounds();
						var rzRect = document.getElementById(sender._restrictionZoneID).getBoundingClientRect();
						// note rzRect height and width are both 1px bigger than the rzElement clientWidth and clientHeight
						// check width and height
						if (position.width > rzRect.width - 3) {
							position.width = rzRect.width - 3;
							sender.set_width(position.width);
						}
						if (position.height > rzRect.height - 3) {
							position.height = rzRect.height - 3;
							sender.set_height(position.height);
						}
						var needToMove = false;
						if (position.x < 1) {
							needToMove = true;
							position.x = 1;
						} else if (position.x > rzRect.width - position.width - 2) {
							needToMove = true;
							position.x = rzRect.width - position.width - 2;
						}
						if (position.y < 1) {
							needToMove = true;
							position.y = 1;
						} else if (position.y > rzRect.height - position.height - 2) {
							needToMove = true;
							position.y = rzRect.height - position.height - 2;
						}
						if (needToMove)
							sender.moveTo(position.x, position.y);
					}
				}
Unplanned
Last Updated: 13 Oct 2020 08:12 by ADMIN
ADMIN
Created by: Rumen
Comments: 0
Category: Window
Type: Bug Report
1
When I try to close the RadWindow on mobile (Chrome Mobile, Chrome Mobile desktop emulator) by clicking on the default Close button (aka X button), if I have a clickable element behind the X button, this one also grabs the input and triggers the OnClick event of the behind element.

The problem can be reproduced in the following demo http://demos.telerik.com/aspnet-ajax/window/examples/radopen/defaultcs.aspx.

Workaround:
<script>   
        function OnClientShow(sender, args) {
            $telerik.$(".rwCloseButton").bind("touchstart", function (e) {
                $telerik.cancelRawEvent(e);
            });
       }
</script>
<telerik:RadWindow OnClientBeforeShow="OnClientShow" RenderMode="Lightweight" ID="RadWindow1" runat="server" ShowContentDuringLoad="false" Width="400px"
                Height="400px" Title="Telerik RadWindow" Behaviors="Default">
</telerik:RadWindow>
Completed
Last Updated: 06 Jul 2018 11:55 by Informat
ADMIN
Created by: Vessy
Comments: 1
Category: Window
Type: Bug Report
1
Each time a window is re-opened its size is decreased with several pixels.

video: https://www.screencast.com/t/kxVyE0U2

Steps to reproduce:
1. Open http://demos.telerik.com/aspnet-ajax/window/examples/modalpopup/defaultcs.aspx
2. Close and re-open RadWindow multiple times

Result: The window's height is decreased each time.

Recommended Workaround: Apply the following CSS class to the page with RadWindow (***  Updated on 22 Jan 2018 ***)

<style>
	.RadWindow {
		padding: 0 6px 6px !important;
	}
</style>


Optional Workaround: Manually resize the Window at the stage of opening it. This example is re-using the width and height set in the markup.

JavaScript
<script>
	function openFixedSize(sender, args) {
		var oWindow = radopen("WindowContent.aspx", "RadWindow1");
		oWindow.__oWidth = oWindow.__oWidth ? oWindow.__oWidth : oWindow.get_width();
		oWindow.__oHeight = oWindow.__oHeight ? oWindow.__oHeight : oWindow.get_height();
		oWindow.setSize(oWindow.__oWidth, oWindow.__oHeight);
	}
</script>

Markup
<telerik:RadButton ID="RadButton1" runat="server" Text="Open - Custom" AutoPostBack="false" OnClientClicked="openFixedSize"></telerik:RadButton>

<telerik:RadWindowManager RenderMode="Lightweight" ID="RadWindowManager1" runat="server">
	<Windows>
		<telerik:RadWindow RenderMode="Lightweight" ID="RadWindow1" runat="server" Title="" Height="500px"
			Width="500px" Left="1px" Top="1px" ReloadOnShow="true" ShowContentDuringLoad="false" Behaviors="None"
			Modal="true" ShowOnTopWhenMaximized="True" VisibleStatusbar="False" VisibleTitlebar="false">
		</telerik:RadWindow>
	</Windows>
</telerik:RadWindowManager>
Unplanned
Last Updated: 06 Nov 2017 16:15 by ADMIN
When I set RadWindow property VisibleTitlebar="false" then top border is missing on window.
Here is sample code:
<telerik:RadWindow runat="server" ID="GenerateReportWaitWindow" Width="440px" Height="200px" 
                    VisibleTitlebar="false" Modal="true" ReloadOnShow="false" VisibleStatusbar="false" 
                    VisibleOnPageLoad="false" EnableShadow="false" Animation="Fade" Behaviors="None"
                    Title="Čakajte prosím...">
                    <ContentTemplate>
                        <div style="min-height: 66%;">
                            <div style="padding-top: 30px; padding-bottom: 45px; text-align: center; font-weight: bold;">
                                <asp:Label ID="Label4" runat="server">Prebieha vytváranie tlačovej zostavy. Čakajte prosím.</asp:Label>
                              
                                <asp:Label ID="Label5" runat="server">(V závislosti od počtu záznamov to môže trvať aj niekoľko minút...)</asp:Label>
                                <asp:Label ID="Label6" runat="server" ForeColor="Red" Style="display: none;"></asp:Label>
                          
                            </div>
                            <div style="margin-left: auto; margin-right: auto; text-align: center;">
                                <asp:Image ID="Image2" runat="server" ImageUrl="~/Images/Animated/loading1.gif" />
                            </div>
                        </div>
                    </ContentTemplate>
                </telerik:RadWindow>

Admin comment:
Actually there is 1px top border, but it is hard to be noticed. As a temporary solution, one can increase it via the following padding:

Copy Code
<style>
    .RadWindow {
        padding: 4px 5px 5px !important;
    }
</style>
Completed
Last Updated: 11 Jun 2021 14:30 by ADMIN
Add role="button" to the anchor tags in RadAlert, RadConfirm, RadPrompt that generate the OK buttons and other buttons on these popups for 508 compliance.  Currently the buttons are being announced as Links (in NVDA).  Workaround is to use a line of JS/Jquery to add the role to the anchor tag.



Unplanned
Last Updated: 30 Oct 2019 08:41 by ADMIN
Created by: Kasim
Comments: 5
Category: Window
Type: Feature Request
1

Bug 1:

When RadWindow behavior is set to Maximize/Minimize only, the expected behavior is while minimized, it must only show Maximize button and when maximized, it should show minimize button. 

Currently, it is showing restore button on minimizing and then it restores to a random size.

Bug 2:

Page reloads on maximizing the minimized page.

  1. If the page requires authentication, the user has to login again.
  2. If the user is on some of the internal pages on a portal, the user is redirected to the login page without referer URL.
Unplanned
Last Updated: 01 Oct 2019 15:08 by ADMIN

Steps to reproduce: 

1) Start dragging a RadWindow;

2) While dragging, use the mouse scroll to scroll the page

Result: The cursor will not be on the title bar anymore.

Unplanned
Last Updated: 25 Jun 2020 12:48 by ADMIN

This issue seems fixed for AzureAD while it is not for WSFederation authentication

It seems the final solution is to manually remove the entries with null/empty key from the submitted form

Completed
Last Updated: 11 Aug 2021 18:47 by ADMIN
Created by: Jason
Comments: 1
Category: Window
Type: Bug Report
0
When using DOCTYPE //W3C//DTD XHTML 1.0 Strict//EN and setting height to 100px 
RadWindow AutoResize=True gives problems in IE10 by adding unnecessary scrollbars, and in Chrome, FF and Safari the window is to high (approx. 55px too much).

Refers to forum entry: http://www.telerik.com/community/forums/aspnet-ajax/window/autosize-behavior-question.aspx
(I used the same sample project to replicate the problem).

 Please see attached screenshot and project.
Unplanned
Last Updated: 03 Nov 2020 13:55 by ADMIN
Created by: tony
Comments: 1
Category: Window
Type: Bug Report
0
I have a radwindow which opens as a modal popup when a button is clicked, in the initial stages the rad window was able to be dragged towards right and bottom, of the screen, even out of the screen bounds, i managed to fix that by setting the KeepInScreenBounds="true" RestrictionZoneID="dvContainerMain", where "dvContainerMain" is the main div within which all the parent controls come
but now when i resize the parent browser window to almost size less than radwindow size, rad window seems to behave weird, am not able to resize the radwindow even if the resize behavior  is set
Please let me know on this issue, 
seems like there is a bug when the RestrictionZoneID width is less than or close to the radwindow size 

Thanks
Tony Thomas