This is a migrated thread and some comments may be shown as answers.

RadWindow won't stay on screen

2 Answers 107 Views
Window
This is a migrated thread and some comments may be shown as answers.
Raeshawn
Top achievements
Rank 1
Raeshawn asked on 30 Jan 2014, 06:14 PM
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadFile.aspx.cs" Inherits="NewBusiness.UploadFile" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .rieDialogs
        {
            z-index: 10000;
        }
        #modalPopup_C
        {
            overflow:hidden !important;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"></telerik:RadAjaxManager>
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <telerik:RadSkinManager ID="RadSkinManager1" runat="server"></telerik:RadSkinManager>
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server"></telerik:RadWindowManager>
        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
            <script>
                var dialog;
                var uploadedFilesCount = 0;

                function OnClientFileUploaded(sender, eventArgs) {
                    uploadedFilesCount++;
                }

                function validateRadAsyncUpload(source, e) {
                    if (uploadedFilesCount > 0)
                        e.IsValid = true;
                    else
                        e.IsValid = false;
                }

                function showImageEditor() {
                    dialog = $find("<%= RwImageEditor.ClientID %>");
                    if (dialog) {
                        dialog.show();
                    }
                    else
                        radalert("Unable to locate image editor window.", 330, 110, "Debug");
                }

                //Callback function for the custom save button in the ImageEditor
                function closeImageEditor(clientData, serverData) {
                    if (dialog)
                        dialog.close();
                    else
                        radalert("Unable to locate image editor window.", 330, 110, "Debug");
                }

                //Automatically resize image to 100 x 100 if it is cropped
                function imgEditorImageChanged(imgEditor, args) {
                    setTimeout(function () {
                        if (args.get_commandName() == "Crop")
                            imgEditor.resizeImage(100, 100, true);
                    }, 500);
                }

                //Create a custom save command for the image editor
                Telerik.Web.UI.ImageEditor.CommandList.SavePicture = function (imageEditor, commandName, args) {
                    imageEditor.saveImageOnServer("Picture", true);
                    closeImageEditor();
                }

            </script>
        </telerik:RadScriptBlock>
        <table>
            <tr>
                <td>
                    <telerik:RadAsyncUpload runat="server" ID="RauPicture"
                        OnClientFileUploaded="OnClientFileUploaded" OnFileUploaded="RauPicture_FileUploaded"
                        AllowedFileExtensions="jpg,jpeg,png,gif" MaxFileSize="1048576" Width="250px">
                    </telerik:RadAsyncUpload>
                    <asp:Button ID="BtnUpload" Text="Upload Image" runat="server"
                        CausesValidation="False" Width="229px" OnClientClick="showImageEditor()">
                    </asp:Button>
                </td>
            </tr>
            <tr>
                <td>
                    <telerik:RadTextBox ID="TextBox1" runat="server" CausesValidation="True" Visible="false"
                            AutoAdjustImageControlSize="false" Height="80px" Width="80px" >
                    </telerik:RadTextBox>
                        <asp:CustomValidator ID="CvRauPicture" runat="server" ErrorMessage="Please select a picture." ControlToValidate="TextBox1" ClientValidationFunction="validateRadAsyncUpload" CssClass="errors" Text="รง"></asp:CustomValidator>    
                </td>
            </tr>
        </table>
        <telerik:RadAjaxPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default" EnableAJAX="true">
            <telerik:RadWindow ID="RwImageEditor" runat="server" Animation="Fade"
                AutoSize="True" Modal="False" VisibleStatusbar="False" Title="Edit Photo" EnableViewState="false" ShowContentDuringLoad="true" VisibleOnPageLoad="false">
                <ContentTemplate>
                    <telerik:RadImageEditor ID="RadImageEditor1" runat="server" OnImageLoading="RadImageEditor1_ImageLoading"
                        OnClientImageChanged="imgEditorImageChanged">
                        <Tools>
                            <telerik:ImageEditorToolGroup>
                                <telerik:ImageEditorTool CommandName="SavePicture" />
                                <telerik:ImageEditorToolSeparator />
                                <telerik:ImageEditorToolStrip CommandName="Undo" />
                                <telerik:ImageEditorToolStrip CommandName="Redo" />
                                <telerik:ImageEditorToolStrip CommandName="Reset" />
                                <telerik:ImageEditorToolSeparator />
                                <telerik:ImageEditorTool CommandName="Crop" />
                                <telerik:ImageEditorTool CommandName="Resize" />
                            </telerik:ImageEditorToolGroup>
                        </Tools>
                    </telerik:RadImageEditor>
                </ContentTemplate>
            </telerik:RadWindow>
        </telerik:RadAjaxPanel>
    </form>
</body>
</html>





2 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 31 Jan 2014, 11:29 AM
Hello Raeshawn,

It would help if you explained what is the action that causes RadWindow to not stay on the screen, instead of leaving us guessing.

At this point, I can assume that the issue is with server events/actions invoked from the RadImageEditor, because it is in the ContentTemplate of the RadWindow. This article explains how to use AJAX in this case: http://www.telerik.com/help/aspnet-ajax/radwindow-ajaxifying.html.
The essence, is that you need the update panel in the ContentTEmplate, so that RadWindow itself is never disposed:
<telerik:RadWindow ID="RwImageEditor" runat="server" Animation="Fade" AutoSize="True"
                   Modal="False" VisibleStatusbar="False" Title="Edit Photo" EnableViewState="false"
                   ShowContentDuringLoad="true" VisibleOnPageLoad="false">
    <ContentTemplate>
        <telerik:RadAjaxPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default" EnableAJAX="true">
            <telerik:RadImageEditor ID="RadImageEditor1" runat="server"
                                    OnClientImageChanged="imgEditorImageChanged">
                <Tools>
                    <telerik:ImageEditorToolGroup>
                        <telerik:ImageEditorTool CommandName="SavePicture" />
                        <telerik:ImageEditorToolSeparator />
                        <telerik:ImageEditorToolStrip CommandName="Undo" />
                        <telerik:ImageEditorToolStrip CommandName="Redo" />
                        <telerik:ImageEditorToolStrip CommandName="Reset" />
                        <telerik:ImageEditorToolSeparator />
                        <telerik:ImageEditorTool CommandName="Crop" />
                        <telerik:ImageEditorTool CommandName="Resize" />
                    </telerik:ImageEditorToolGroup>
                </Tools>
            </telerik:RadImageEditor>
        </telerik:RadAjaxPanel>
    </ContentTemplate>
</telerik:RadWindow>



Regards,
Marin Bratanov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
Raeshawn
Top achievements
Rank 1
answered on 26 Aug 2014, 03:42 PM
Thanks
Tags
Window
Asked by
Raeshawn
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Raeshawn
Top achievements
Rank 1
Share this question
or