[Solved] RadWindow w/ UpdatePanel not working

[jgig]

I am trying to add dynamic RadWindows and Buttons to an UpdatePanel (not sure how to do it with RadAjax or RadAjaxManager). When the buttons have been added I am using their ID for the OpenerID of the RadWindow.

So a simple (text visual layout of this is)

UpdatePanel
--ImageButton(s) that load(s) a RadWindow(s) when clicked

My problem is when I click the button nothing happens, I think it is an AJAX javascript issue. If I load the buttons when the page loads it works great, the problem is I need to add some dynamically and when I do this outside of the page load they do nothing.

I included sample code to show you the problem with comments.

thanks for you help!

.NET 3.5

aspx

    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager runat="server" ID="ScriptManager1" EnablePartialRendering="true" />
    <table class="style2">
        <tr>
            <td>
                <asp:UpdatePanel ID="pnlSubMenu" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false" >
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="btnAJAX_Search" EventName="Click" />
                    </Triggers>
                </asp:UpdatePanel>
            </td>
            <td align="right">
                <%--Will hide this button to initiate call to pnlSubMenu later when it is working--%>
                <asp:Button ID="btnAJAX_Search" runat="server" OnClick="btnAJAX_Search_Click" Text="AJAX Add Search" />
            </td>
        </tr>
    </table>

    <script type="text/javascript">
        function Update_pnlSubMenu()
        {
           __doPostBack("<%= btnAJAX_Search.ClientID %>","");
        }
    </script>

    <table class="style1">
        <tr>
            <td>&nbsp;</td>
            <td class="centerme">Center Windows Here</td>
            <td>&nbsp;</td>
        </tr>
    </table>

    <telerik:RadWindowManager ID="RadWindowManager1" Skin="Office2007" runat="server"
            Modal="true" Animation="Resize" VisibleStatusbar="true">
    </telerik:RadWindowManager>

    </div>
    </form>

C#  aspx.cs

using System;
using System.Collections;
using System.Configuration;
using System.Web;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace TestPage
{
    public partial class RadTest : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //If I uncomment this out and I allow the buttons to be loaded on page load then it works
            //I want to use ajax to initiate when this, plus since this is dynamic I do not want to use visibleonload

            //BuildSubMenu();
        }

        protected void BuildSubMenu()
        {
            string[] urls = new string[] { "http://www.google.com", "http://www.farelogix.com", "http://www.telerik.com" };

            pnlSubMenu.ContentTemplateContainer.Controls.Clear();//Clear them and readd for this demo purpose
            RadWindowManager1.Windows.Clear();//Clear them and readd for this demo purpose

            for (int i = 1; i < 4; i++)
            {
                Button Btn = new Button();
                Btn.ID = "Search" + i;
                Btn.Text = "Search " + i;

                pnlSubMenu.ContentTemplateContainer.Controls.Add(Btn);

                RadWindow radWin = new RadWindow();
                radWin.ID = "RadWinID" + i;
                radWin.OpenerElementID = "Search" + i;
                radWin.NavigateUrl = urls[i-1];

                RadWindowManager1.Windows.Add(radWin);
            }
        }

        protected void btnAJAX_Search_Click(object sender, EventArgs e)
        {
            BuildSubMenu();
        }
    }
}

[Paul Hopper]

I believe you need
  radWin.VisibleOnPageLoad = true;
before you add it to the window manager.

[jgig]

I want the window to load only after they press the button, not on page load.

[Paul Hopper]

Yeah, I know.  I just started using the RadWindow myself and had that same reaction when I first read that that's what you need to do.  Try it.  You'll see.

If you think about it, the window doesn't exist until the user clicks the button, right?  So there's no reason worry about it showing up with the page first loads, because it doesn't exist then.  When the user clicks the button and you do the postback, the response from the postback now has the window and, in a sense, the page (or at least that portion of the page) just loaded and the window now exists and will appear for you. :)

[jgig]

I tried it and it didn't work. I'm not saying I don't need it there, that might just be a seperate issue. When I click the button, no noticeable changes to the page occur though.

[jgig]

Any tips from the Telerik team? It looks like it is about complete, I think there is just a script error or something breaking because of the AJAX call.

[jgig]

im not feeling the love. on your posts, you say to include code for faster more accurate responses. I have done that, anything else I can do to get some feedback?

[Svetlina Anati]

Hi jgig,

I examined your code and I was able to reproduce the described problem.

The RadWindow control is intended to replace the standard browser popups and your particular approach is not the most suitable for the desired scenario.

Instead of this, we suggest to use the following approach:

            Button Btn = new Button();
            Btn.ID = "Search" + i;
            Btn.Text = "Search " + i;


            Btn.Attributes["onclick"] = "radopen('" + urls[i - 1] + "','RadWinID" + i +"'); return false;";

            pnlSubMenu.ContentTemplateContainer.Controls.Add(Btn);

I send you back your modified project - you can find it in the attached archive file.

I noticed that you have expected to get a faster answer - please, note that the forum threads are mainly for the community and we answer support tickets with a higher priority. This being said, if you want to address an urgent issue, it is better to open a support ticket.


Greetings,
Svetlina
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[jgig]

thank you for getting back to me. I had one working like this example and what I don't like about this is there is no reference to the location of which button was clicked. so the animation I chose comes from the top left corner instead of the upper right side where I placed the buttons dynamically.

I guess I will use javascript to dynamically start it where the button is and then center the window. If you have a quick script already for that I would appreciate it.

thanks again

[Georgi Tunev]

Hello jgig,

Indeed, currently it is not possible to modify the animation properties of the RadWindow - this is logged in our database as a feature request. As for centering the window, you can use its center() client-side method.



Kind regards,
Georgi Tunev
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[jgig]

on your post you mention that my use of the control was not the most suitable for this control. So I wanted to make one last attempt at getting this to work the way I was trying. 

Why is it not suitable, is it unsupported or complicated? Is it possible?

The way I had it set up it was using the OpenerID and the radwindow would "fly out" from where it was clicked to the center of the screen w/animation, now it isnt obviously doing that since it is initiated with javascript and you cant assign an opener location from the button. This is a desired effect that I have been asked to provide. Can it be done?

[Svetlina Anati]

Hi jgig,

One of the main problems in your approach is that you update the Windows collection of RadWindowManager on the server but the client object never gets updated.

We suggest to create and configure the windows in the same manner as you do with the buttons:

 protected void BuildSubMenu()
    {
        string[] urls = new string[] { "http://www.google.com", "http://www.farelogix.com", "http://www.telerik.com" };

        pnlSubMenu.ContentTemplateContainer.Controls.Clear();//Clear them and readd for this demo purpose
        //RadWindowManager1.Windows.Clear();//Clear them and readd for this demo purpose

        for (int i = 1; i < 4; i++)
        {
            Button Btn = new Button();
            Btn.ID = "Search" + i;
            Btn.Text = "Search " + i;

            pnlSubMenu.ContentTemplateContainer.Controls.Add(Btn);

            RadWindow radWin = new RadWindow();
            radWin.ID = "RadWinID" + i;
            radWin.OpenerElementID = Btn.ClientID;//"Search" + i;
            radWin.NavigateUrl = urls[i - 1];

            radWin.Skin="Office2007";
            radWin.Modal= true;
            radWin.Animation = WindowAnimation.Resize;
            pnlSubMenu.ContentTemplateContainer.Controls.Add(radWin);

        }
    }

We tested this code and it works as you want.

Please, find attached our testing project.

Best wishes,
Svetlina
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[jgig]

it is now working. I am not sure why Svetlina told me to do it on the client when it clearly works fine this way. I think my problem was I was trying to put my dynamcally created rad window and add it to the rad window manager programatically. I was just supposed to put it in the update panel. I removed the radmanager like your sample and it works w/out any manager at all.

thank you!

[BCTCGS]

I've been looking for this solution for awhile. I've been using the RadWindow for quite some time now, but always tended not to use it on a page where the button was found in an ASP UpdatePanel.

My organization does alot of development using IronSpeed to do the basic generation and then we do all sorts of fancier or more advanced stuff using standard ASP controls and Telerik.

I would always try to fire the RadWindow on the button click event in the server side code behind code, but would always have issues as mentioned in the previous post. I added the following code as suggested and works great...

 Dim strURL As String
strURL = "../WORK_ORDER/CGSCopyOwnertoApplicant.aspx?WORK_ORDER=" & Me.Decrypt(Me.Request.QueryString("WORK_ORDER"))
CopyOwnerButton.Button.Attributes.Add("onclick", "radopen('" & strURL & "', 'RadWindowManagerCopyOwner');return false;")

Thanks for the great post, saved me lots of headache.