ASP.NET Custom Login Control

Good-day,

I am having troubles with something that is likely very simple...

I've added a login control to my asp.net project (in C#) and it works fine if I wrap it around <LayoutTemplate></LayoutTemplate>

But the formating is not correct; So I remove the <LayoutTemplate> tags and it reports errors that it cannot find the <p> tag etc.

My question is what is <LayoutTemplate> and how do I customize a login control?

Attached is the first bit of the ascx control...
Thanks very much for your time.
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="LoginControl.ascx.cs" 
    Inherits="UserControls_FinalLoginControls_LoginControl" %> 
    

<asp:Login ID="Login1" runat="server">


<p id="login_username">

Open in new window

PastorDwayneAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

guru_samiCommented:
you need a LayoutTemplate ....so you cannot remove it.
---->But the formating is not correct;
What problem you faced in customizing it ?
0
meispiscesCommented:
Post a detailed code. this code is not enough...
0
PastorDwayneAuthor Commented:
Thanks very much for your comments, I really appreciate it.

I've attached the entire asx file; as well screen shots of what it looks like, and what it should look like.  I thought the issue may be from the LayoutTemplate (as indicated here: http://www.sitefinity.com/support/forums/sitefinity-3-x/developing-with-sitefinity/login-control.aspx)

But perhaps that's not the issue?
Thanks again for your time
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="LoginControl.ascx.cs" 
    Inherits="UserControls_FinalLoginControls_LoginControl" %> 
    

<asp:Login ID="Login1" runat="server">
<LayoutTemplate>

<p id="login_username">
<asp:TextBox ID="UserName" runat="server" CssClass="inputbox" Text="Username..."   onblur="if(this.value=='') this.value='Username...';" onfocus="if(this.value=='Username...') this.value='';"></asp:TextBox>
<asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="ctl00$Login1">*</asp:RequiredFieldValidator>
</p>

 <p id="login_password">
<asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="inputbox" Text="Password..."  onblur="if(this.value=='') this.value='Password...';" onfocus="if(this.value=='Password...') this.value='';"></asp:TextBox>
<asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="ctl00$Login1">*</asp:RequiredFieldValidator>
</p>


<p>
<asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal>
</p> 

<p id="login_button">
<asp:Button ID="LoginButton" runat="server" CommandName="Login" CssClass="round" Text="Log In" ValidationGroup="ctl00$Login1" />
</p>
<p id="login_remember">
<asp:CheckBox ID="RememberMe" runat="server" CssClass="remember" Text="Remember me next time." />
</p>

     <p class="login_lost">
     	Lost my        
        <a href="#">Password</a>
        or <a href="#">Username</a>

    </p>


</LayoutTemplate>

</asp:Login>

Open in new window

LooksLike.png
shouldLookLike.png
0
guru_samiCommented:
That has to do with how you have placed your controls i.e. markup and Css
Look at the example below and try setting appropriate Css for the controls.
<style type="text/css">
    .loginpanel{
    padding:10px;
    border:solid 1px black; 
    widht:440px; 
    margin:10px; 
    background-color:#E5E5E5;
    }
    .logincontrol{
    height:120px;
    width:450px;
    padding:5px;
    background:#DCDDDE;
    }
    </style>

<asp:Login ID="Login2" runat="server" CssClass="logincontrol">
        <LayoutTemplate>
            <asp:Panel ID="Panel1" runat="server" CssClass="loginpanel" >
            
            <div>
                <div id="login_username" style="float: left">
                    <asp:TextBox ID="UserName" runat="server" CssClass="inputbox" Text="Username..."
                        onblur="if(this.value=='') this.value='Username...';" onfocus="if(this.value=='Username...') this.value='';"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
                        ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="ctl00$Login1">*</asp:RequiredFieldValidator>
                </div>
                <div id="login_password" style="float: left">
                    <asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="inputbox"
                        Text="Password..." onblur="if(this.value=='') this.value='Password...';" onfocus="if(this.value=='Password...') this.value='';"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
                        ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="ctl00$Login1">*</asp:RequiredFieldValidator>
                </div>
                <div id="login_button" style="float: left">
                    <asp:Button ID="LoginButton" runat="server" CommandName="Login" CssClass="round"
                        Text="Log In" ValidationGroup="ctl00$Login1" />
                </div>
            </div>
            <div style="clear: both">
            </div>
            <div>
                <div>
                    <asp:Literal ID="FailureText" runat="server" EnableViewState="False"></asp:Literal>
                </div>
                <div id="login_remember" style="float: left">
                    <asp:CheckBox ID="RememberMe" runat="server" CssClass="remember" Text="Remember Me" />
                    &nbsp; | I lost my <a href="#">Password</a> or <a href="#">Username</a>
                </div>
            </div>
            <div style="clear: both">
            </div>
            </asp:Panel>
        </LayoutTemplate>
    </asp:Login>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
PastorDwayneAuthor Commented:
Thanks very much!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.