RadFileExplorer with RadWindow

6 posts, 0 answers
  1. Randhir
    Randhir avatar
    15 posts
    Member since:
    Jul 2010

    Posted 19 Dec 2011 Link to this post

    Hi Guys,

    I am stuck with this problem since a month.

    I have used telerk.web.ui.fileexplorer on the left of the page. In this fileexplorer i have added a custom button with label "New Document" and ask for fiilename.

    On click of this button, i show telerik web ui window with a textbox. In this dialog on click of submit button i am supposed to grab the entered value in dialog box in parent page and alert it.

    But i can't return value to parent page from this dialog box page.

    I have already done this with other sample projcet and was successfully able to return value from dialog box to parent page. But when i used this facility with FileExplorer it doesn't seem to work.

    Please suggest if i am not going in the right direction, may be i should also look for alternative, but this sample should work i don't know what's going on.
  2. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 21 Dec 2011 Link to this post

    Hi Randhir,

    Please take a look at the following live demo I believe it will help you for the required scenario:
    Returning Values from a Dialog

    Regards,
    Dobromir
    the Telerik team
    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 RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Randhir
    Randhir avatar
    15 posts
    Member since:
    Jul 2010

    Posted 25 Dec 2011 Link to this post

    Dobromir,
    Thanks for the reply.

    Actually, i have already been through the live demo you say.

    It works with, but when i use it with telerik asp.net ajax fileexplorer. It doesn't work.

    Any more suggestions.
  5. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 26 Dec 2011 Link to this post

    Hi Randhir,

    Could you please provide more detailed information regarding the issues that you experience? Are there any JavaScript errors thrown on the page? Could you please provide a sample code demonstrating the issue?

    For your convenience I have prepared a sample page following the described scenario. Could you please modify it to a point where the problem occurs and send it back?

    All the best,
    Dobromir
    the Telerik team
    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 RadControls for ASP.NET AJAX, subscribe to their blog feed now
  6. Randhir
    Randhir avatar
    15 posts
    Member since:
    Jul 2010

    Posted 05 Jan 2012 Link to this post

    Hi DobroMir,

    Here is my situation. I have a web page in which i have used Telerik.Web.UI.FileExplorer. On load of FileExplorer i have added new button that says "New Doc". On click of "New Button", i ask for filename from user in Dialog Box. On click of Submit button in this dialog box, i am not able to alret the text entered in the dialog box.

    Here is all the code file:
    WebForm1.aspx
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="RadFileExplorerTest.WebForm1" %>
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <meta http-equiv="Cache-Control" content="no-cache">
        <meta http-equiv="Pragma" content="no-cache">
        <meta http-equiv="Expires" content="0">
        <title></title>
        <script type="text/javascript">
     
            function toolbarClicked(toolbar, args) {
                var buttonValue = args.get_item().get_value();
                if (buttonValue == "NewDocCommand") {
     
                    openWin();
                    return false;
                }
            }
     
            function attachHandlers(explorer, args) {
     
                var toolbar = explorer.get_toolbar();
                toolbar.add_buttonClicked(toolbarClicked);
     
            }       
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <script type="text/javascript">
        //<![CDATA[
            function openWin() {
                var oWnd = radopen("Dialog1.aspx", "RadWindow1");
            }
     
            function OnClientClose(oWnd, args) {
     
                //get the transferred arguments
                var arg = args.get_argument();
                if (arg) {
                    var fileName = arg.fileName;
                    alert("Filename: " + fileName);               
                }
            }
    //]]>
        </script>
        <telerik:RadWindowManager ID="RadWindowManager1" ShowContentDuringLoad="false" VisibleStatusbar="false"
            ReloadOnShow="true" runat="server" EnableShadow="true" Skin="Hay">
            <Windows>
                <telerik:RadWindow ID="RadWindow1" runat="server" Behaviors="Close" OnClientClose="OnClientClose"
                    NavigateUrl="Dialog1.aspx">
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
        <telerik:RadFileExplorer runat="server" ID="FileExplorer1" Width="350px" Height="600px"
            TreePaneWidth="150px" OnClientLoad="attachHandlers" Skin="Hay">
            <Configuration ViewPaths="~/" UploadPaths="~/" DeletePaths="~/" />
        </telerik:RadFileExplorer>
        </form>
    </body>
    </html>

    Here is WebForm1.aspx.cs
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace RadFileExplorerTest
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {           
                //Add New Document Button
                RadToolBarButton btnAddNewDoc = new RadToolBarButton("New Doc");
                btnAddNewDoc.CssClass = "test_button";
                btnAddNewDoc.Value = "NewDocCommand";
                FileExplorer1.ToolBar.Items.Add(btnAddNewDoc);
            }
        }
    }

    Here is Dialog1.aspx
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Dialog1.aspx.cs" Inherits="RadFileExplorerTest.Dialog1" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title>New File</title>
        <style type="text/css">
            html, body, form
            {
                padding: 0;
                margin: 0;
                height: 100%;
                background: #f2f2de;
            }
             
            body
            {
                font: normal 11px Arial, Verdana, Sans-serif;
            }
             
            fieldset
            {
                height: 150px;
            }
             
            * + html fieldset
            {
                height: 154px;
                width: 268px;
            }
        </style>
    </head>
    <body onload="AdjustRadWidow();" >  
        <form id="Form2" method="post" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <script type="text/javascript">
            function GetRadWindow() {
                var oWindow = null;
                if (window.radWindow) oWindow = window.radWindow;
                else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
                return oWindow;
            }
     
            function openWin2() {
                var parentPage = GetRadWindow().BrowserWindow;
                var parentRadWindowManager = parentPage.GetRadWindowManager();
                var oWnd2 = parentRadWindowManager.open("Dialog2.aspx", "RadWindow2");
                window.setTimeout(function () {
                    oWnd2.setActive(true);
                }, 0);
            }
     
            function populateCityName(arg) {
                var cityName = document.getElementById("cityName");
                cityName.value = arg;
            }
     
            function AdjustRadWidow() {
                var oWindow = GetRadWindow();
                setTimeout(function () { oWindow.autoSize(true); if ($telerik.isChrome || $telerik.isSafari) ChromeSafariFix(oWindow); }, 500);
            }
     
            //fix for Chrome/Safari due to absolute positioned popup not counted as part of the content page layout
            function ChromeSafariFix(oWindow) {
                var iframe = oWindow.get_contentFrame();
                var body = iframe.contentWindow.document.body;
     
                setTimeout(function () {
                    var height = body.scrollHeight;
                    var width = body.scrollWidth;
     
                    var iframeBounds = $telerik.getBounds(iframe);
                    var heightDelta = height - iframeBounds.height;
                    var widthDelta = width - iframeBounds.width;
     
                    if (heightDelta > 0) oWindow.set_height(oWindow.get_height() + heightDelta);
                    if (widthDelta > 0) oWindow.set_width(oWindow.get_width() + widthDelta);
                    oWindow.center();
     
                }, 310);
            }
     
            function returnToParent() {
                //create the argument that will be returned to the parent page
                var oArg = new Object();
     
                //get the city's name           
                oArg.fileName = document.getElementById("txtFileName").value;
     
                //get a reference to the current RadWindow
                var oWnd = GetRadWindow();
     
     
     
     
                //Close the RadWindow and send the argument to the parent page
                if (oArg.fileName) {
                    oWnd.close(oArg);
                }
                else {
                    alert("Please fill both fields");
                }
            }
        </script>
        <div style="width: 268px; height: 193px;">
            <fieldset id="fld1">
                Enter FileName:
                <input type="text" id="txtFileName" value="" />
            </fieldset>
            <div style="margin-top: 4px; text-align: right;">
                <button title="Submit" id="close" onclick="returnToParent(); return false;">
                    Submit</button>
            </div>
        </div>
         
        </form>
    </body>
    </html>

    Here is Dialog1.aspx.cs
    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;
    using Telerik.Web.UI;
    using System.Threading;
     
    namespace RadFileExplorerTest
    {
        public partial class Dialog1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
        
            }
        }
    }

    and Here is my Web.config
    <?xml version="1.0"?>
     
    <!--
      For more information on how to configure your ASP.NET application, please visit
      -->
     
    <configuration>
        <system.web>
        <compilation debug="true" targetFramework="4.0" />
          <httpRuntime maxRequestLength="102400"/>
          <httpHandlers>
            <add verb="*" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.Upload.RadUploadProgressHandler, Telerik.Web.UI"/>
            <add verb="*" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4"></add>
            <add verb="*" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4"></add>
            <add verb="*" path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" validate="false"/>
            <add path="Telerik.Web.UI.WebResource.axd" verb="*" type="Telerik.Web.UI.WebResource, Telerik.Web.UI" validate="false"/>
          </httpHandlers>
          <httpModules>
            <add name="RadCompression" type="Telerik.Web.UI.RadCompression"/>
            <add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule, Telerik.Web.UI"/>
          </httpModules>
          <pages clientIDMode="AutoID"/>
      </system.web>
     
      <system.webServer>
        <modules runAllManagedModulesForAllRequests="true">
          <add name="RadCompression" type="Telerik.Web.UI.RadCompression"/>
          <add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule, Telerik.Web.UI" preCondition="managedHandler"/>
        </modules>
        <handlers>
          <add name="ChartImage.axd_*" path="ChartImage.axd" verb="*" type="Telerik.Web.UI.ChartHttpHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" preCondition="integratedMode"/>
          <add name="Telerik.Web.UI.SpellCheckHandler.axd_*" path="Telerik.Web.UI.SpellCheckHandler.axd" verb="*" type="Telerik.Web.UI.SpellCheckHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" preCondition="integratedMode"/>
          <add name="Telerik.Web.UI.DialogHandler.aspx_*" path="Telerik.Web.UI.DialogHandler.aspx" verb="*" type="Telerik.Web.UI.DialogHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" preCondition="integratedMode"/>
          <add name="Telerik.RadUploadProgressHandler.ashx_*" path="Telerik.RadUploadProgressHandler.ashx" verb="*" type="Telerik.Web.UI.Upload.RadUploadProgressHandler, Telerik.Web.UI" preCondition="integratedMode"/>
          <add name="Telerik.Web.UI.WebResource.axd_*" path="Telerik.Web.UI.WebResource.axd" verb="*" type="Telerik.Web.UI.WebResource, Telerik.Web.UI" preCondition="integratedMode"/>
        </handlers>
        <validation validateIntegratedModeConfiguration="false"/>
      </system.webServer>
    </configuration>

    With these files i created a sample solution. But i am not able to grab the value returned from the dialog box.
    Please help, Thanks,
  7. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 09 Jan 2012 Link to this post

    Hi Randhir,

    The problem that you experience is due to the fact that there are two RadWindowManager's registered on the page - one custom and one that is built-in inside RadFileExplorer. The radopen() method that is used in the provided setup is using the built-in manager and the displayed window does not have assigned OnClientClose event.

    To avoid this you should use specific RadWindowManager's open() method to display the window correct RadWindow. You should modify the openWin() function to match the following:
    function openWin()
    {
        var oWndManager = $find("<%=RadWindowManager1.ClientID%>");//get reference to the external RadWindowManager
        var oWnd = oWndManager.open(null, "RadWindow1");//open the predefined window
    }


    Regards,
    Dobromir
    the Telerik team
    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 RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017