Close RadWindow from server side button click event ?

11 posts, 2 answers
  1. Aravind
    Aravind avatar
    41 posts
    Member since:
    Jun 2013

    Posted 01 Aug 2013 Link to this post

    Hi
     How to close rad window from server side click event ?.From main page button click event i open Rad Window ,and in that i use three text boxes,if all text boxes having value ,it will store in database and close that rad window,if any one text box is empty rad window not close and show the error msg.

    My code is :

    In Client Side Code:

       function CloseAndRedirect(sender, args) {
                GetRadWindow().BrowserWindow.location.href = 'Default1.aspx';        //Redirect to new url 
                GetRadWindow().close();       //closes the window       
            }

            function GetRadWindow()   //Get reference to window    
            {
                var oWindow = null;
                if (window.radWindow)
                    oWindow = window.radWindow;
                else if (window.frameElement.radWindow)
                    oWindow = window.frameElement.radWindow;
                return oWindow;
            }

    Server Side Code :

     Protected Sub btnSendMail_Click(sender As Object, e As EventArgs) Handles btnSendMail.Click
                 If (txtName.Text = "" or txtcompany.Text="" or txtphone.Text="" ) Then

                          ShowMessage("enter all values")

                Else
                 'Dim script As String = "<script language='javascript' type='text/javascript'>Sys.Application.add_load(CloseAndRedirect);</script>"
                'ClientScript.RegisterStartupScript(Me.GetType(), "Close", script)

                Dim script As String = "<script language='javascript' type='text/javascript'>Sys.Application.add_load(CloseAndRedirect());</script>"
                RadScriptManager.RegisterStartupScript(Me, Me.GetType(), "CloseAndRedirect()", script, False)

        End Sub

    I try both in else block ,but both not work.it show error like "0x800a1391 - Microsoft JScript runtime error: 'Sys' is undefined".

    My need is close the rad window when  server side button click event in and stay in main page

    Pls Reply asap.......
        Regards
            Aravind
  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 02 Aug 2013 Link to this post

    Hi Aravind,

    Please have a look into the following full code I tried which worked fine at my end. Here is the mark-up of the main page from where I am opening a RadWindow.

    ASPX:
    <telerik:RadWindow ID="RadWindow1" runat="server" Width="350px" Height="350px" NavigateUrl="~/CPage.aspx">
    </telerik:RadWindow>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Open RadWindow" AutoPostBack="false"
        OnClientClicked="openRadWindow">
    </telerik:RadButton>

    JavaScript:
    <script type="text/javascript">
        function openRadWindow(sender, args) {
            var radwindow = $find('<%=RadWindow1.ClientID %>');
            radwindow.show();
        }
    </script>

    Here is the mark-up and C# of the page I am opening inside the RadWindow.

    ASPX:
    <div style="padding: 15px 15px 20px 25px;">
        <telerik:RadTextBox ID="RadTextBox1" runat="server">
        </telerik:RadTextBox>
        <br />
        <telerik:RadTextBox ID="RadTextBox2" runat="server">
        </telerik:RadTextBox>
        <br />
        <telerik:RadTextBox ID="RadTextBox3" runat="server">
        </telerik:RadTextBox>
        <br />
        <telerik:RadButton ID="RadButton1" runat="server" Text="Click" OnClientClicking="OnClientClicking"
            OnClick="RadButton1_Click">
        </telerik:RadButton>
    </div>

    JavaScript:
    <script type="text/javascript">
        function OnClientClicking(sender, args) {
            var textboxvalue1 = $find('<%=RadTextBox1.ClientID %>').get_value();
            var textboxvalue2 = $find('<%=RadTextBox2.ClientID %>').get_value();
            var textboxvalue3 = $find('<%=RadTextBox3.ClientID %>').get_value();
            if (textboxvalue1.length == 0 || textboxvalue2.length == 0 || textboxvalue3.length == 0) {
                args.set_cancel(true);
                alert("Your Error Message");
            }
        }
        function closeWin() {
            GetRadWindow().BrowserWindow.location.href = 'Default2.aspx';
            GetRadWindow().close();
        }
        function GetRadWindow() {
            var oWindow = null; if (window.radWindow)
                oWindow = window.radWindow; else if (window.frameElement.radWindow)
                oWindow = window.frameElement.radWindow; return oWindow;
        }
    </script>

    C#:
    protected void RadButton1_Click(object sender, EventArgs e)
    {
        //Your Code to Write Value to DataBase;
     
        //Closing the RadWindow.
        string script = "function f(){closeWin(); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true); 
    }

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Sam
    Sam avatar
    27 posts
    Member since:
    Sep 2013

    Posted 10 Jan 2014 Link to this post

    Hello Shinu,

    I get error from Chrome developer tools says:

    Uncaught TypeError: Cannot call method 'close' of null

    <telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">
            <script type="text/javascript">
                function OpenWindow(sender, eventArgs) {
                    window.radopen(null, "RadWindow1").maximize();
                }            
                function GetRadWindow() {
                    var oWindow = null;
                    if (window.radWindow)
                        oWindow = window.radWindow;
                    else if (window.frameElement && window.frameElement.radWindow)
                        oWindow = window.frameElement.radWindow;
                    return oWindow;
                }
                function CloseModal() {
                    // GetRadWindow().close();
                    setTimeout(function () {
                        GetRadWindow().close();
                    }, 0);
                }
                
            </script>
        </telerik:RadCodeBlock>

    and code behind to call the CloseModal() function
    protected void RadButton1_Click(object sender, EventArgs e)
           {
               string script = "function f(){CloseModal(); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
               ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true);
           }
  5. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3599 posts

    Posted 10 Jan 2014 Link to this post

    Hello Sam,

    This way of getting a reference to the RadWindow (the GetRadWindow() function) can be used only from inside its content page. Otherwise it will return null and you will get such an error. Thus, I suspect that you are either using the ContentTemplate, or trying to get the reference from outside of the dialog. In both cases you will usually need to use the $find() function. You can see this in action here: http://demos.telerik.com/aspnet-ajax/window/examples/contenttemplatevsnavigateurl/defaultcs.aspx.


    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 RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  6. Sam
    Sam avatar
    27 posts
    Member since:
    Sep 2013

    Posted 10 Jan 2014 Link to this post

    Hi Marin,

    Your guess is correct.  I used RadWindow ContentTemplate
    <telerik:RadWindowManager runat="server" ID="RadWindowManager1" Modal="true" EnableShadow="true"
            Behaviors="Close,Resize,Move,Maximize" VisibleOnPageLoad="false" EnableViewState="false">
            <Windows>
    <telerik:RadWindow runat="server" ID="RadWindow1" ShowContentDuringLoad="false">
                    <ContentTemplate>
                        <asp:Panel runat="server" ID="pnlHotel">
                            <!-- content -->
                        </asp:Panel>
                    </ContentTemplate>
                </telerik:RadWindow>
    </Windows>
        </telerik:RadWindowManager>

    protected void RadButton1_Click(object sender, EventArgs e)
            {
                string script = "function f(){CloseModal(); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
                ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true);
            }


    To Open RadWindow ContentTemplate
    <telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">
            <script type="text/javascript">
                function OpenWindow(sender, eventArgs) {
                    window.radopen(null, "RadWindow1").maximize();
                }
     </script>
        </telerik:RadCodeBlock>

    To Close RadWindow ContentTemplate
    <telerik:RadCodeBlock runat="server" ID="RadCodeBlock2">
            <script type="text/javascript">
                function CloseModal() {
                    // GetRadWindow().close();
                    $find("<%=RadWindow1.ClientID%>").close();
                }          
            </script>
        </telerik:RadCodeBlock>

    Is there a way to use one CloseModal() function to close every RadWindow by pass in the ClientID ? This way I have to create each CloseModal() function for each RadWindow

    And I still get error: Uncaught TypeError: Cannot call method 'close' of null

    Please help

    Thanks,
    Sam
  7. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 13 Jan 2014 Link to this post

    Hi Sam,

    Please have a look into the sample code snippet which works fine at my end.

    ASPX:
    <asp:Button ID="Button3" Text="open the window" runat="server" OnClientClick="openWinContentTemplate(); return false;">
    </asp:Button>
    <br />
    <telerik:RadWindow runat="server" ID="RadWindow_ContentTemplate" RestrictionZoneID="ContentTemplateZone"
        Modal="true">
        <ContentTemplate>
            <asp:Button ID="Button1" Text="send value and close" runat="server" OnClientClick="populateValue(); return false;">
            </asp:Button>
        </ContentTemplate>
    </telerik:RadWindow>

    JavaScript:
    <script type="text/javascript">
        function openWinContentTemplate() {
            $find("<%=RadWindow_ContentTemplate.ClientID %>").show();
        }
        function populateValue() {
            $find("<%=RadWindow_ContentTemplate.ClientID%>").close();
        }  
    </script>

    Thanks,
    Princy
  8. Sam
    Sam avatar
    27 posts
    Member since:
    Sep 2013

    Posted 13 Jan 2014 Link to this post

    Hi Princy,

    This works fine, but my scenario has multiple RadWindow within RadWindowManager.  I have to create each javascript function for open/close.  Can it be re-written to one open/close function to open/close RadWindow?

    Thanks for your help
    -Sam
  9. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 14 Jan 2014 Link to this post

    Hi Sam,

    Please have a look into the following code snippet to achieve your scenario.

    C#:
    protected void RadButton1_Click(object sender, EventArgs e)
    {
        //pass the ClientID of the RadWindow to open
        string script = "function f(){Open('"+RadWindow1.ClientID+"'); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true);
    }
    protected void RadButton2_Click(object sender, EventArgs e)
    {
        //pass the ClientID of the RadWindow to close
        string script = "function f(){Close('" + RadWindow1.ClientID + "'); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true);
    }

    JavaScript:
    <script type="text/javascript">
        function Open(win) {
            var window = document.getElementById(win);
            window.control.Show();
        }
        function Close(win) {
            var window = document.getElementById(win);
            window.control.Close();
        }
    </script>

    Thanks,
    Shinu.
  10. Sam
    Sam avatar
    27 posts
    Member since:
    Sep 2013

    Posted 14 Jan 2014 Link to this post

    This is what I need

    Thank you,
    -Sam
  11. Karla
    Karla avatar
    6 posts
    Member since:
    Apr 2012

    Posted 24 Feb 2014 in reply to Shinu Link to this post

    function OnClientClicking is not working for me. The following like returns null

    var textboxvalue1 = $find('<%=RadTextBox1.ClientID %>').get_value(); 

    It works for any controls in the parent page but not for controls in the radwindow, seems like I can't access controls in the child radwindow. Any idea why?
  12. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 24 Feb 2014 in reply to Karla Link to this post

    Hi Karla,

    Please have a look into the sample code snippet to achieve your scenario.

    ASPX:
    <telerik:RadWindow ID="RadWindow1" runat="server" VisibleOnPageLoad="true">
        <ContentTemplate>
            <telerik:RadTextBox ID="RadTextBox1" runat="server">
            </telerik:RadTextBox>
            <telerik:RadButton ID="RadButton1" runat="server" Text="GetValue" AutoPostBack="false"
                OnClientClicking="OnClientClicking1">
            </telerik:RadButton>
        </ContentTemplate>
    </telerik:RadWindow>

    JavaScript:
    <script type="text/javascript">
        function OnClientClicking1(sender, args) {
            var value = $find('<%=RadTextBox1.ClientID %>').get_value();
            alert(value);
        }
    </script>

    Please provide your code if it doesn't help.
    Thanks,
    Shinu.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017