Geeks With Blogs
mikedopp Geekswithblogs (edition)

Simple and Pretty Cool.

Originally Posted on

 <a id="login-link" href="javascript:showLogin();">Login</a>
    <div id="login-panel" style="visibility: hidden;">
       <fieldset onkeydown="checkForEnter();">
               <input type="text" id="userName" /></label>
               Password:<input type="password" id="password" /></label>
           <label class="checkbox" for="rememberMe">
               <input type="checkbox" id="rememberMe" checked="checked" />Remember Me
               <asp:Button ID="Button1" runat="server" UseSubmitBehavior="false" onClientClick="setTimeout(loginButton_Click, 0); return false;" Text="Login &raquo;" PostBackUrl="~/catalog/Default.aspx" /></label></fieldset>

Javascript involved:
   These functions here are mearly for a "WOW" factor. They have nothing
    to do with ASP.NET AJAX. The ASP.NET AJAX functionality is below.

var hideTimerID = 0;
   function showLogin() {
       $get("login-link").style.visibility = "hidden";
       $get("login-panel").style.visibility = "visible";
       // Hide the login panel after 30 seconds.
       hideTimerID = setTimeout(hideLogin, 30000);
   function hideLogin() {
       $get("login-link").style.visibility = "visible";
       $get("login-panel").style.visibility = "hidden";
       // Blank out the username and password for security reasons.
       $get("userName").value = "";
       $get("password").value = "";
   function checkForEnter(e) {
       if (!e) e = window.event;
       if (e && e.keyCode == 13) {

Now we are in the actual ASP.NET AJAX implementation. These are some very
  simple JavaScript methods that will tap into the ASP.NET AJAX Framework.


function errorCallback(error) {
   function loginCallback(loggedIn) {
       if (loggedIn == false) {
           alert("The username and password you supplied is invalid.");
   function loginButton_Click() {
       Sys.Services.AuthenticationService.login($get("userName").value, $get("password").value,
           $get("rememberMe").checked, null, location.href, loginCallback, errorCallback);
   function logoutButton_Click() {
       Sys.Services.AuthenticationService.logout(location.href, null, errorCallback);
Of course feel free to change it how you like but this is the basic howto.

Posted on Wednesday, February 20, 2008 10:47 AM | Back to top

Comments on this post: like Login Control

No comments posted yet.
Your comment:
 (will show your gravatar)

Copyright © mikedopp | Powered by: