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

Problems with Tooltips and RadAlerts with MaterPages.

1 Answer 62 Views

General Discussions

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

Miklos asked on 10 Jul 2008, 10:07 PM

Hi,

I have a small problem -which may seem like a normal everyday thing for the gurus here at the forum- but I just cannot get over it.

Here is the scenario I am trying to achieve. I have a master page with a login area on the top and a main content. The login area has two states :
1/ displaying the login form
2/ displaying the user name

If the username is invalid (currently set to check if the username is "user") then I display a Tooltip. If it is valid I change the visibility of a Panel to display the userpanel. This part works more or less.

Once the user has logged in the inner content will display two buttons. One should display an alert after it is pressed and its operations are complete (not using onclick since I need to process the data, I just set a boolean to force it to appear).

The second button should display a tooltip after its operations are successful.

The problem is the following:
1/ The alert NEVER appears! I tried using the InjectScript example in one of the previous posts. The code is inserted but is
never displayed. I added the RadWindowManager and everything but to no avail.
2/ The tooltip is displayed but only as a hover effect over the button. After the postback the text is changed as per the code BUT it still gets displayed as a hover. The tooltip should only appear once and not appear after hovering.

Can someone please sort this problem out since it has been causing me alot of headaches. I read somewhere that using masterpages and panels/ajax is not the way to go, but then in these situations how do you solve the standard login architecture (where the user can change his username without reposting the whole site)

I have attached a stripped down demo project with the problems layed out.

Please help me,

Thanks,
Miklos Kalman

Since I couldn't attach the project here are the files one by one:

MainPage.Master:

    
            <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MainPage.master.cs" Inherits="TestLoginTelerik.MainPage" %> 
        
            <%@ 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> 
        
                <asp:ContentPlaceHolder ID="head" runat="server"> 
        
                </asp:ContentPlaceHolder> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> 
        
                </telerik:RadAjaxManager> 
        
                <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" 
        
                    Width="75px"> 
        
                    <img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' 
        
                        style="border: 0px;" /> 
        
                </telerik:RadAjaxLoadingPanel> 
        
                <div> 
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        
                    <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server"> 
        
                    </telerik:RadToolTipManager> 
        
                    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" skin="Vista"> 
        
                    </telerik:RadWindowManager> 
        
                    <asp:Panel ID="LoginPanel" runat="server"> 
        
                    <table> 
        
                    <tr> 
        
                    <td>[HEADER]</td> 
        
                    <td> 
        
                        <asp:Label ID="Label1" runat="server" Text="Username"></asp:Label> <telerik:RadTextBox ID="LoginName" runat="server"> 
        
                        </telerik:RadTextBox> 
        
                        <telerik:RadToolTip ID="RadToolTip1" runat="server" TargetControlId="LoginName" 
        
                         Position="MiddleRight" 
        
                         Text="Error text goes here "/> 
        
                    <asp:Button ID="LoginBtn" runat="server" Text="Login"  
        
                            onclick="LoginBtn_Click" /> 
        
                    </td> 
        
                    </tr> 
        
                    </table> 
        
                    </asp:Panel> 
        
                    <asp:Panel ID="UserPanel" runat="server"> 
        
                        <asp:Label ID="UserMessage" runat="server" Text="Label"></asp:Label> 
        
                    </asp:Panel> 
        
                    <br /> 
        
                    ========================================================= 
        
                    <br /> 
        
                    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> 
        
                    </asp:ContentPlaceHolder> 
        
                    <br /> 
        
                    ========================================================== 
        
                    <br /> 
        
                    [FOOTER] 
        
                    <br /> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

----------------------
MainPage.Master.cs:

    
            using System; 
        
            using System.Collections; 
        
            using System.Configuration; 
        
            using System.Data; 
        
            using System.Linq; 
        
            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; 
        
            namespace TestLoginTelerik 
        
            { 
        
                public partial class MainPage : System.Web.UI.MasterPage 
        
                { 
        
                    protected void Page_Load(object sender, EventArgs e) 
        
                    { 
        
                        if (Session["logged_in"] != null) 
        
                        { 
        
                            string val = (string)Session["logged_in"]; 
        
                            if (val.Equals("yes")) 
        
                            { 
        
                                UserPanel.Visible = true; 
        
                                LoginPanel.Visible = false; 
        
                                string name = (string)Session["user_name"]; 
        
                                UserMessage.Text = "Welcome " + name; 
        
                                return; 
        
                            } 
        
                        } 
        
                        UserPanel.Visible = false; 
        
                        LoginPanel.Visible = true; 
        
                    } 
        
                    protected void LoginBtn_Click(object sender, EventArgs e) 
        
                    { 
        
                            if (LoginName.Text == "user") 
        
                            { 
        
                                UserPanel.Visible = true; 
        
                                LoginPanel.Visible = false; 
        
                                UserMessage.Text = "Welcome " + LoginName.Text; 
        
                                Session["logged_in"] = "yes"; 
        
                                Session["user_name"] = LoginName.Text; 
        
                                Response.Redirect("~/Default.aspx"); 
        
                            } 
        
                            else 
        
                            { 
        
                                //display a tooltip over the LoginName field 
        
                                RadToolTip1.Text = "Error!"; 
        
                                RadToolTip1.Show(); 
        
                            } 
        
                    } 
        
                } 
        
            }

-----------------------
Default.aspx:

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestLoginTelerik._Default" MasterPageFile="~/MainPage.Master"%> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <asp:Content ContentPlaceHolderID="head" runat="server"> 
        
            </asp:Content> 
        
            <asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> 
        
                <telerik:RadWindowManager ID="RadWindowManager1" runat="server"> 
        
                </telerik:RadWindowManager> 
        
            <br /> 
        
            DEFAULT CONTENT<br /> 
        
                <asp:Panel ID="ContentPanel" runat="server"> 
        
                    <asp:Button ID="Button1" runat="server" Text="Button Displaying Alert"  
        
                        onclick="Button1_Click" /> 
        
                    <asp:Button ID="Button2" runat="server" Text="Button Displaying Tooltip"  
        
                        onclick="Button2_Click" /> 
        
                        <telerik:RadToolTip ID="RadToolTip2" runat="server" TargetControlId="Button2" 
        
                         Position="MiddleRight" 
        
                         Text="Error text goes here" 
        
                         VisibleOnPageLoad="false" > 
        
                        </telerik:RadToolTip> 
        
                        <asp:Literal ID="InjectScript" runat="server"></asp:Literal> 
        
                </asp:Panel> 
        
            </asp:Content>

-----------------------
Default.aspx.cs:

    
            using System; 
        
            using System.Collections; 
        
            using System.Configuration; 
        
            using System.Data; 
        
            using System.Linq; 
        
            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; 
        
            namespace TestLoginTelerik 
        
            { 
        
                public partial class _Default : System.Web.UI.Page 
        
                { 
        
                    protected void Page_Load(object sender, EventArgs e) 
        
                    { 
        
                        if (Session["logged_in"] != null) 
        
                        { 
        
                            string val = (string)Session["logged_in"]; 
        
                            if (val.Equals("yes")) 
        
                            { 
        
                                ContentPanel.Visible = true; 
        
                            }else 
        
                                ContentPanel.Visible = false; 
        
                        }else 
        
                            ContentPanel.Visible = false; 
        
                    } 
        
                    protected void Button1_Click(object sender, EventArgs e) 
        
                    { 
        
                        bool operationcomplete = false; //emulation to make sure the alert appears 
        
                        //.... process operation and set the operationcomplete variable 
        
                        if (!operationcomplete) 
        
                        { 
        
                            string strMsg = "radalert('Operation failed!', 330, 100);"; 
        
                            InjectScript.Text = "<script>" + strMsg + "</" + "script>"; 
        
                        } 
        
                    } 
        
                    protected void Button2_Click(object sender, EventArgs e) 
        
                    { 
        
                         bool operationcomplete = false; //emulation to make sure the alert appears 
        
                        //.... process operation and set the operationcomplete variable 
        
                         if (!operationcomplete) 
        
                         { 
        
                             RadToolTip2.Text = "Button Click"; 
        
                             RadToolTip2.Show(); 
        
                         } 
        
                    } 
        
                } 
        
            }

1 Answer, 1 is accepted

answered on 15 Jul 2008, 01:19 PM

Hi Miklos,

Up to your questions:

Since you need to show the tooltip only when called from server, you need to set the ShowEvent property to FromCode.
As for showing the radalert, please note that in ASP.NET AJAX environment, the controls are not created when the page is loaded, but in a later stage. That is why when you call your script, the RadWindowManager will still not be rendered on the page and you will get the error. That is why I would recommend to use the Sys.Application.add_load() method and add the Javascript there - this will ensure that the controls will be loaded before that. More information on the subject is available in the ASP.NET AJAX documentation and there are many examples of this approach here in the forums.

All the best,
Georgi Tunev
the Telerik team

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