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

Using Radwindow in a Masterpage

6 Answers 389 Views
Window
This is a migrated thread and some comments may be shown as answers.
Jhun
Top achievements
Rank 1
Jhun asked on 01 Sep 2008, 04:03 AM
Hi,

Could somebody give me an example of code using a radwindow in a masterpage?

Or somebody who could give me a clear sample program of dialog box (radwindow) returning a value?

I'm quite confused in the sample given at the documentation and also it is incomplete when it comes to explaining.

I'm just quite new to the technology and I wanted to use it in our project.

Thanks,
Jhun

6 Answers, 1 is accepted

Sort by
0
Georgi Tunev
Telerik team
answered on 01 Sep 2008, 01:33 PM
Hello Jhun,

I assume that you are opening the RadWindow by using the OpenerElementID property. Note that this property expects the client ID of the opener element and when you are in a MasterPage scenario, the ID and the ClientID's of the controls are different. That is why you need to set the OpenerElementID like this:
OpenerElementId = "<%# ServerButton.ClientID %>"
where ServerButton is the id of the element.

I hope this helps. If you still experience problems, please send us a sample project with your implementation and we will check it. Just open a new support ticket and attached the zipped project to it.


Best wishes,
Georgi Tunev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Jhun
Top achievements
Rank 1
answered on 11 Sep 2008, 07:26 AM
Hi Georgi,

Thanks for the reply and as I look at some of your sample codes, I observed that you were using <textarea> and not <radTextbox>.

Can you please give me some code samples wherein you were using <radTextbox> and not <textarea>, I'm having problem when using the variable declaration, "var oArea = document.getElementById("InfoArea");", at the script. The error will display that object is not known.

How can I retrieve the value of the said <radTextbox>?

Thanks in advance,
Jhun
0
Jhun
Top achievements
Rank 1
answered on 12 Sep 2008, 02:53 AM
Hi,

I've found the solution for my current inquiry, but for now, the problem that I'm encountering is on how to pop the dialog window again after postback. I have a button from a ascx page and upon clicking the said button, it will display the popup. Upon closing the popup and clicking the button again, it would not display the popup window.

Below are the code snippet:
1) UserControl1.ascx
    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="UserControl1.ascx.cs" Inherits="UserControl" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
                /* Show the window*/
                function ShowDialog()
                {
                    //window.radopen(null, "DialogWindow");
                   
                    //Forced reload (option 1): In order to force a reload on the dialog, the following approach should be used
                    //window.radopen("./SimpleDialog.aspx", "DialogWindow");
                   
                    //Forced reload (option 2): If one is not sure what the current url is, forced reload can be achieved like this:
                    var oWnd = window.radopen(null, "DialogWindow");
//                    oWnd.setUrl(oWnd.get_NavigateUrl());
                }
               
                /* Called when a window is being shown. Good for setting an argument to the window */
                function OnClientShow(radWindow)
                {                   
                    //Get current content of textarea
//                    var oText = document.getElementById("InfoArea").value;
//                    var oText = $find("<%=txtRegionwide.ClientID%>")
//                   
//                    //Create a new Object to be used as an argument to the radWindow
//                    var arg = new Object();                   
//                    //Using an Object as a argument is convenient as it allows setting many properties.
//                    arg.TextValue = oText;
//                    arg.Color = "red";
//                    arg.BackColor = "#cccccc";
//                                       
//                    //Set the argument object to the radWindow       
//                    radWindow.argument = arg;
                }
                                                                       
               
                function CallBackFunction(radWindow, returnValue)
                {
                    //var oArea = document.getElementById.getElementById("InfoArea");
//                    var oArea = document.getElementById("txtRegionwide");
                    var oArea = $find("<%=txtRegionwide.ClientID%>");
//                    alert(oArea.get_value());
//                    alert('return ' + returnValue);
//                    if (returnValue) oArea.set_value = returnValue;
                    if (returnValue) oArea.set_value(returnValue);
                    else
                    {
//                      alert ("No text was returned");
                      oArea.set_value("");
                    }
//                    alert('FINAL ' + oArea.get_value());
                }
               
                /* Called when a window is being closed. */
                function OnClientClose(radWindow)
                {
//                    //Another option for passing a callback value
//                    //Set the radWindow.Argument property in the dialog
//                    if (radWindow.argument)
//                     {
////                          var oArea = document.getElementById("InfoArea");
//                        var oArea = $find("<%=txtRegionwide.ClientID%>")
//                        oArea.value = radWindow.argument;
//                     }
//                     else
//                     {
//                       alert ("No text was returned");
//                       oArea.value = "";
//                     }               
                    //Do cleanup if necessary
                }   
                           
        </script>
        </telerik:RadCodeBlock>

         <telerik:RadTextBox ID="txtRegionwide" Runat="server" Skin="Vista" Width="200px"  />
          <asp:Button ID="btnRegionwide" runat="server" Height="10px" Text="..."   Width="16px" />
            <telerik:RadWindowManager ID="Singleton" runat="server" ClientCallBackFunction="CallBackFunction"
                OnClientShow="OnClientShow" OnClientClose="OnClientClose" ReloadOnShow="true" Modal="true" >
                <Windows>
                    <telerik:RadWindow ID="RadWindow1" Modal="true" runat="server" Width="250px" Height="250px"
                        Title="Dialog" OpenerElementID="<%# btnRegionwide.ClientID %>"  NavigateUrl="~/PopRegion.aspx">
                    </telerik:RadWindow>
                </Windows>
            </telerik:RadWindowManager>

2) ParentPage.aspx
<%@ Page Language="C#" MasterPageFile="~/main_profile.master" AutoEventWireup="true" CodeFile="EditFoundationInfo.aspx.cs" Inherits="ParentPage" Title="Untitled Page" %>
<%@ Register src="/UserControl1.ascx" tagname="UserControl1" tagprefix="uc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="profileMainContent" Runat="Server">
    <uc1:UserControl1 ID="UserControl11" runat="server" />
</asp:Content>

3) main_profile.master
<%@ Master Language="C#" MasterPageFile="~/root.master" AutoEventWireup="true" CodeFile="main_profile.master.cs" Inherits="main_profile" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="rootContent" Runat="Server">
            <div class="main">
    <asp:ContentPlaceHolder id="profileMainContent" runat="server">
    </asp:ContentPlaceHolder>
    </div>
</asp:Content>

4) root.master
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="root.master.cs" Inherits="root" %>

<%@ 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">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
      <meta http-equiv="cache-control" content="no-cache" />
      <meta http-equiv="expires" content="3600" />
    <asp:ContentPlaceHolder id="head" runat="server">
        <link rel="icon" type="image/x-icon" href="~/images/favicon.ico" />
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True"
        EnableTheming="True">
    </telerik:RadScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
        <asp:ContentPlaceHolder id="rootContent" runat="server">     
        </asp:ContentPlaceHolder>
    </form>
</body>
</html>

5) PopRegion.ascx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PopRegion.aspx.cs" Inherits="PopRegion" %>

<%@ 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">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <script type="text/javascript">       
        //This code is used to provide a reference to the radwindow "wrapper"
        function GetRadWindow()
        {
            var oWindow = null;
            if (window.radWindow) oWindow = window.radWindow;
            else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
            return oWindow;
        }       
       
        function ConfigureDialog()
        {
            //Get a reference to the radWindow wrapper
            var oWindow = GetRadWindow();
           
            //Obtain the argument
            var oArg = oWindow.argument;
           
            //Use the argument
            var oArea = document.getElementById("hdnField");
//            oArea.value = oArg.TextValue;
            oArea.style.color = oArg.Color;
            oArea.style.backgroundColor = oArg.BackColor;                   
        }
       
       
        function OK_Clicked()
        {
            var oWindow = GetRadWindow();
            //Get current content of text area
            var oNewText = document.getElementById("hdnField").value;
//            alert ("Text to be returned to main page: " + oNewText);       
            oWindow.Close(oNewText);
        }
       
        function Cancel_Clicked()
        {
            var oWindow = GetRadWindow();
            oWindow.argument = null;           
            oWindow.Close();
        }       
   
   
    //the way the function OK_Clicked should look in order to use the  OnClientClose function     
//        function OK_Clicked(radWindow)
//                {                           
//                var oNewText = document.getElementById("DialogInfoArea").value;
//                alert ("Text to be returned to main page: " + oNewText);
//                oWindow.argument = oNewText;
//                oWindow.Close();

//                    //Do cleanup if necessary
//                }   
               
        </script>   
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
        </telerik:RadScriptManager>
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" height="200px"
            width="300px">
        <asp:CheckBoxList ID="CheckBoxList1" runat="server" onselectedindexchanged="cbxRegion_SelectedIndexChanged" AutoPostBack="True">
            <asp:ListItem Value="1">Region I</asp:ListItem>
            <asp:ListItem Value="2">Region II</asp:ListItem>
            <asp:ListItem Value="3">Region III</asp:ListItem>
            <asp:ListItem Value="4">Region IV</asp:ListItem>
            <asp:ListItem Value="5">Region V</asp:ListItem>
        </asp:CheckBoxList>
                <br />
                <asp:Button ID="btnOK" runat="server" Text="OK"
                    OnClientClick="OK_Clicked(); return false;"  />
                <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClientClick="Cancel_Clicked(); return false;" />
        <telerik:RadTextBox ID="hdnText" Runat="server" Width="0px" />
        <asp:HiddenField ID="hdnField" runat="server" />
        </telerik:RadAjaxPanel>
    </div>
    </form>
</body>
</html>

6) PopRegion.aspx.cs
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class PopRegion : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    protected void cbxRegion_SelectedIndexChanged(object sender, EventArgs e)
    {
        int ctr = 0;
        CheckBoxList cbx = (CheckBoxList) sender;
        StringBuilder sb = new StringBuilder();

cbx.Items[cbx.SelectedIndex].Text;
        for (int i = 0; i < cbx.Items.Count; i++)
        {
            if (cbx.Items[i].Selected)
            {
                ctr++;

                if (ctr > 1)
                {
                    sb.Append(", ");
                    sb.Append(cbx.Items[i].Text);
                }
                else
                    sb.Append(cbx.Items[i].Text);
            }
        }

        hdnField.Value = sb.ToString();
    }
}

Hoping that somebody from the forum can help me. I'm not yet familiarized with some of the methods/properties of the Telerik controls.

Thanks,
Jhun


0
Georgi Tunev
Telerik team
answered on 15 Sep 2008, 10:24 AM
Hi Jhun,

I ran your code and as you can see from the attached video, the window is opened as expected. Please open a support ticket and send us a small sample project where the problem can be reproduced - we will check it and do our best to help.



Kind regards,
Georgi Tunev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Jhun
Top achievements
Rank 1
answered on 17 Sep 2008, 05:26 AM
Hi Georgi,

Thanks for giving the solution, but for now, my question would be on how to get the value of the said textbox in the server-side.

From the solution that I gave, I would add a save button and store the value of the radtextbox upon clicking the said button. But upon clicking the save button, the value retrieved from radtextbox is null, it doesn't get the value displayed.

Hope you can help.

Thanks,
Jhun
0
Georgi Tunev
Telerik team
answered on 17 Sep 2008, 01:57 PM
Hello Jhun,

At this point I cannot tell what the reason for the problem might be - everything is working fine on my side. I just added a simple button and a label to the user control and set the label's text in the codebehind:

<asp:Button ID="postbackBtn" runat="server" Text="Postback to server" OnClick="postbackBtn_Click" /> 
<br /> 
<asp:Label ID="lbl1" runat="server"></asp:Label> 

protected void postbackBtn_Click(object sender, EventArgs e)  
{  
    lbl1.Text = txtRegionwide.Text;  

As you can see from the attached movie, everything is working as expected. If you still experience this problem, please send me a sample project that I can check locally.


Greetings,
Georgi Tunev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Window
Asked by
Jhun
Top achievements
Rank 1
Answers by
Georgi Tunev
Telerik team
Jhun
Top achievements
Rank 1
Share this question
or