More in this section

Forums / General Discussions / Modal login

Modal login

3 posts, 0 answered
  1. emil makkar
    emil makkar avatar
    4 posts
    07 Jun 2004
    16 Aug 2011
    Link to this post
    Has anyone been able to get a model dialog with postback to work with Sitefinity 4. I'm trying to implement a modal login and have not been able to find examples of how this is done. I've implemented a custom login widget with and update panel to host the login form, however, it doesn't seem to be behaving properly in Sitefinity so, I don't know if I'm doing something wrong.

    Any help would be appreciated.

    Here's what i got so far

    --- Login.ascx
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Login.ascx.cs" Inherits="Nutreco.Controls.Login" %>
    <%@ Register TagPrefix="act" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit, Version=3.0.20820.16598, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e" %>
    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server"></asp:ScriptManagerProxy>
    <asp:LoginStatus ID="LoginStatus1" runat="server"
        LoginText="Sign In"
        LogoutText="Sign Out"
        OnLoggingOut="OnSignOut" />
    <act:ModalPopupExtender ID="LoginStatus1_ModalPopupExtender" runat="server"
    <act:AnimationExtender ID="openAnimation" runat="server" TargetControlID="LoginStatus1">
                <Parallel AnimationTarget="Panel1" Duration=".7" Fps="25">
                    <FadeIn />
    <asp:Panel ID="Panel1" runat="server" CssClass="lightbox" Style="display: none">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <div class="holder">
                    <asp:LinkButton ID="lnkClose" runat="server" CssClass="close" OnClick="OnClose" />
                    <div class="sign-form">
                            <h3>Sign In</h3>
                            <label for="text1">Please enter your Username and Pasword:</label>
                            <div class="text">
                                <asp:TextBox runat="server" id="userName" />
                                <asp:RequiredFieldValidator runat="server" ID="userNameRequired"
                                    ControlToValidate="userName" ErrorMessage="User Name is required."
                            <div class="text">
                                <asp:TextBox runat="server" ID="password" TextMode="Password" />
                                <asp:RequiredFieldValidator ID="passwordRequired" runat="server"
                                    ControlToValidate="password" ErrorMessage="Password is required."
                            <div class="btn-block">                                
                                <asp:Button runat="server" ID="btnSignIn" CssClass="submit" ValidationGroup="ctl00$Login" OnClick="OnSignIn" />
                            <asp:Label runat="server" ID="message" CssClass="message" />
                <span class="top-l"></span><span class="top-r"></span><span class="bottom-l"></span><span class="bottom-r"></span>
            <act:TextBoxWatermarkExtender ID="userNameWatermark" runat="server"
                WatermarkCssClass="defaultTextActive" />
            <act:TextBoxWatermarkExtender ID="passwordWatermark" runat="server"
                WatermarkCssClass="defaultTextActive" />
  2. Steve
    Steve avatar
    3037 posts
    03 Dec 2008
    16 Aug 2011
    Link to this post
    Have you tried using a Fancybox or RadWindow (in ContentTemplate mode)?

    I have my login control inside of a "popup" like twitter, but not a modal window, although the principle wouldn't be any different.
  3. Boyan Barnev
    Boyan Barnev avatar
    1429 posts
    28 Aug 2017
    19 Aug 2011
    Link to this post

    Here's an idea - you can create a masterpage with your regular layout, which contains the login button/link and the Login control. What you can do is add an additional div element (e.g. "overlay") that is hidden by default but fades in when you press the login button and thus covers the entire content. You'll have another div as well (e.g. "LoginWrapper"), containing the login control which also fades in and displays the login control on top of the overlay div. Of course you can always fine-tune this by setting a cookie that will keep the login window open if an unsuccessful login attempt occurs, or implement similar functionalities, however the above solution seems the easiest to implement and will provide you with a modal login control that's present on your template an thus postback to the correct page every time. Please do not hesitate to contact me if this solution differs from what you demanded or you need some additional information.

    Best wishes,
    Boyan Barnev
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
3 posts, 0 answered