RadWindow for ASP.NET AJAX
Contents
RadControls for ASP.NET AJAX

Several functions let you open a RadWindow object from your client-side javascript:

  • The show method lets you open a single window that has been declared on your page when there is no RadWindowManager object. You can use ASP.NET AJAX's $find method to obtain a reference to the window.

  • The RadWindowManager.open method opens a window if you have a reference to a RadWindowManager object. You can easily obtain this reference by calling GetRadWindowManager.

  • The radopen function is essentially the same as GetRadWindowManager().open(). It requires the RadWindowManager to exist on the page, even though you do not explicitly reference it in your code.

  • The radalert, radconfirm, and radprompt functions open the built-in alert, confirm, and prompt dialogs. As with radopen, these functions require a RadWindowManager to be present on the page.

Using show()

The following code illustrates how to use the window.show method to open a window when there is no RadWindowManager object:

CopyJavaScript
var oWnd = $find("<%=RadWindow1.ClientID%>");
oWnd.setUrl('MyPage.aspx');
oWnd.show();

Using radopen and GetRadWindowManager().open

Both the radopen() function and the GetRadWindowManager().open() method take two parameters:

  1. Url. This supplies the URL for the content window. If this is given an argument of null, the NavigateUrl property set for the window on the server is used.

  2. Name. This is the ID of particular (existing) RadWindow object to show. If this is given an argument of null, the function creates a new window with a random ID. If a window with the provided ID does not exist a new one is created by using this ID.

Both functions return a reference to the RadWindow object, so it can be additionally configured using the various RadWindow methods. The following code illustrates the possibilities for using radopen. (Note you could replace the call to radopen() with a call to GetRadWindowManager().open()).

CopyJavaScript
//Open a new window, with no url set
var oWnd = radopen(null, null);
//Open a new window, set its url to Google
var oWnd = radopen("http://www.google.com", null);
//Open an existing window, without setting its URL
// The existing window's NavigateUrl property will be used
var oWnd = radopen(null, "WindowNameHere");
//Open Google in existing window
var oWnd = radopen("http://www.google.com", "WindowNameHere");

Example

The following markup shows how to use radopen(), GetRadWindowManager().open(), and the RadWindow object's show() method to open a window:

CopyASPX
the RadWindowManager object has two child windows
<telerik:RadWindowManager ID="RadWindowManager1" runat="server">
    <Windows>
        <telerik:RadWindow ID="RadWindow1" runat="server" NavigateUrl="http://www.google.com">
        </telerik:RadWindow>
        <telerik:RadWindow ID="RadWindow2" runat="server" NavigateUrl="http://www.telerik.com">
        </telerik:RadWindow>
    </Windows>
</telerik:RadWindowManager>
the client-side code for opening windows
<script type="text/javascript">
    /* Using radopen */
    function ShowExisting1()
    {
        //Show an existing window
        window.radopen(null, "RadWindow1");
        //First argument is the URL. Since no url is provided, the NavigateUrl property set on the server will be used.
    }
    /* Using RadWindowManager.open */
    function ShowExisting2()
    {
        //Call existing global function to obtain a reference to the window manager
        var oManager = GetRadWindowManager();
        //Show a particular existing window
        oManager.open(null, "RadWindow2");
    }
    // using RadWindow.show
    function ShowExisting3()
    {
        var oWnd = $find("RadWindow1");
        oWnd.show();
    }
    /* Show new window */
    function ShowNewWindow()
    {
        //Show new window
        //not providing a name as a second parameter
        // creates a new window
        var oWindow = window.radopen("http://www.google.com", null);
        //Using the reference to the window its clientside methods can be called
        oWindow.setSize(400, 400);
    }
</script>
call the various client-side functions
<button onclick="ShowExisting1();return false;" class="Button" style="width: 190px">
    Show window (using radopen)</button>
<br>
<button onclick="ShowExisting2();return false;" class="Button" style="width: 190px">
    Show window (using open)</button>
<br>
<button onclick="ShowExisting3();return false;" class="Button" style="width: 190px">
    Show window (using show)</button>
<br>
<button onclick="ShowNewWindow();return false;" class="Button" style="width: 190px">
    Show new window</button>

See Also