Forums

Home / Developer Network / Forums / Sitefinity 3.x: Security > Javascript Login

• Philip Senechal Master

  Posted on Jul 13, 2009 (permalink)

  In my current project that I'm trying to merge into Sitefinity, I handled the login via Javascript so that I could integrate the login into the site instead of separate page. Here is the coding that successfully controlled the login functionality using the built in .NET provider:
  
      protected void Page_Load(object sender, EventArgs e)
      {
          if (Context.User.Identity.IsAuthenticated)
          {
              Label firstName = LoginView1.FindControl("FirstName") as Label;
              Label lastName = LoginView1.FindControl("LastName") as Label;
              firstName.Text = Profile.FirstName;
              lastName.Text = Profile.LastName;
  
              string scriptString = "";
              scriptString += "<script type=\"text/javascript\">";
              scriptString += "function logoutButton_Click() {";
              scriptString += "Sys.Services.AuthenticationService.logout('Home.aspx', null, errorCallback, null);";
              scriptString += "}";
              scriptString += "function errorCallback(error) {";
              scriptString += "alert(error.get_message());";
              scriptString += "}";
              scriptString += "</script>";
              Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "logoutView", scriptString);
          }
          else
          {
              RadMultiPage loginPage = LoginView1.FindControl("RadMultiPage1") as RadMultiPage;
              string scriptString = "";
              scriptString += "<script type=\"text/javascript\">";
              scriptString += "function loginView_Show() {";
              scriptString += "var loginPage = $find('" + loginPage.ClientID + "');";
              scriptString += "loginPage.set_selectedIndex(1);";
              scriptString += "setTimeout('usernameGetFocus();',500);";
              scriptString += "setTimeout('loginView_Hide();',30000);";
              scriptString += "}";
              scriptString += "function loginView_Hide() {";
              scriptString += "var loginPage = $find('" + LoginView1.FindControl("RadMultiPage1").ClientID + "');";
              scriptString += "loginPage.set_selectedIndex(0);";
              scriptString += "}";
              scriptString += "function usernameGetFocus() {";
              scriptString += "$get(\"userName\").focus();";
              scriptString += "}";
              scriptString += "function loginCallback(loggedIn) {";
              scriptString += "if (loggedIn == false) {";
              scriptString += "alert(\"The username and password you supplied is invalid.\");";
              scriptString += "$get(\"userName\").value = \"\";";
              scriptString += "$get(\"password\").value = \"\";";
              scriptString += "$get(\"userName\").focus();";
              scriptString += "}";
              scriptString += "}";
              scriptString += "function loginButton_Click() {";
              scriptString += "Sys.Services.AuthenticationService.login($get(\"userName\").value, $get(\"password\").value, false, null, 'default.aspx', loginCallback, errorCallback);";
              scriptString += "}";
              scriptString += "function errorCallback(error) {";
              scriptString += "alert(error.get_message());";
              scriptString += "}";
              scriptString += "</script>";
              Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "loginView", scriptString);
          }
      }
  
  This scripting doesn't seem to work in Sitefinity. The displaying of the controls works fine, but hitting login/logout doesn't seem to work, which makes me think the Sys.Services.AuthenticationService Javascript methods either don't work properly with Sitefinity or that I have to use a different method.
  
  Can you let me know if the approach I used before will work with Sitefinity and how to modify my script to work? Thanks for the assistance.
  

  Reply

• Parvan Parvan

  Posted on Jul 14, 2009 (permalink)

  Hello Philip Senechal,
  
  

  It is important to configure the Authentication service on client side by setting these lines in the web.config:
  

  <system.web.extensions>

  <scripting>

  <webServices>

  <authenticationService enabled="true" />

  </webServices>

  </scripting>

  </system.web.extensions>

  
  

  Please check if you have these lines in your web.config file and take a look at these instructions - Using Forms Authentication with ASP.NET AJAX.

  
  

  I hope this helps you.

  
  Best wishes,
  Parvan
  the Telerik team

  
  Instantly find answers to your questions on the newTelerik Support Portal.
  Check out the tipsfor optimizing your support resource searches.

  Reply

• Philip Senechal Master

  Posted on Jul 14, 2009 (permalink)

  Thank you...I didn't have the authentication service enabled. Before that, my login control didn't do anything, however now that I have that setting enabled, I'm receiving the error message "The server method 'Login' failed."
  
  Might you have any suggestions on why I would be receiving this error and how to get around it? This code worked outside of Sitefinity, so I'm assuming there is probably something else I need to change. Thanks again.

  Reply

• Parvan Parvan

  Posted on Jul 15, 2009 (permalink)

  Hi Philip Senechal,
  
  

  Can you supply the page markup so we can reproduce the problem on our side.
  
  All the best,
  Parvan
  the Telerik team

  
  Instantly find answers to your questions on the newTelerik Support Portal.
  Check out the tipsfor optimizing your support resource searches.

  Reply

• Philip Senechal Master

  Posted on Jul 15, 2009 (permalink)

  Hi Parvan...the code is currently in my Master page, but it may look weird when you run it because I have quite a bit of Javascript and CSS styling on it. Here is the master page as it stands right now...
  
  

  <%@ Master Language="C#" AutoEventWireup="true" CodeFile="ScoutopiaHome.master.cs"

  Inherits="App_Master_ScoutopiaHome" %>

  <!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>Scoutopia</title>

  <meta http-equiv="content-type" content="text/html; charset=utf-8" />

  </head>

  <body>

  <form id="form1" runat="server">

  <asp:ScriptManager ID="ScriptManager1" runat="server">

  <Scripts>

  <asp:ScriptReference Path="~/App_Themes/Scoutopia/mootools.js" />

  <asp:ScriptReference Path="~/App_Themes/Scoutopia/JScript.js" />

  </Scripts>

  </asp:ScriptManager>

  <div id="wrapper_main">

  <div id="popup_login">

  <div id="close_button_login">

  </div>

  <div class="top">

  <ul class="loginposition">

  <li>

  <label for="modlgn_username">

  Username</label>

  <input id="modlgn_username" type="text" name="username" class="inputbox" alt="username"

  size="15" />

  </li>

  <li>

  <label for="modlgn_passwd">

  Password</label>

  <input id="modlgn_passwd" type="password" name="passwd" class="inputbox" size="15"

  alt="password" />

  </li>

  <li id="form-login-button">

  <input type="submit" name="Submit" class="button" value="Login" onclick="javascript:loginButton_Click();" />

  </li>

  </ul>

  </div>

  <div class="bottom">

  </div>

  </div>

  <div id="popup_register">

  <div id="close_button_register">

  </div>

  <div class="top">

  </div>

  <div class="bottom">

  </div>

  </div>

  <div id="wrapper_top">

  <asp:HyperLink ID="logo" NavigateUrl="~/Home.aspx" ImageUrl="~/App_Themes/Scoutopia/Images/logo.png"

  runat="server" />

  <div id="search">

  <div class="search">

  <asp:ContentPlaceHolder ID="Search" runat="server" />

  </div>

  </div>

  <div id="buttons">

  <span id="login_btn"><a href="#">Login</a></span> <span id="register_btn"><a href="#">

  Register</a></span>

  </div>

  </div>

  </div>

  </form>

  </body>

  </html>

  
  and here is the code behind for the Master page
  

  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.WebControls;

  using System.Web.UI.WebControls.WebParts;

  using System.Web.UI.HtmlControls;

  using System.Xml.Linq;

  public partial class App_Master_ScoutopiaHome : System.Web.UI.MasterPage

  {

  protected void Page_Load(object sender, EventArgs e)

  {

  string scriptString = "";

  scriptString += "<script type=\"text/javascript\">";

  scriptString += "function loginCallback(loggedIn) {";

  scriptString += "if (loggedIn == false) {";

  scriptString += "alert(\"The username and password you supplied is invalid.\");";

  scriptString += "$get(\"modlgn_username\").value = \"\";";

  scriptString += "$get(\"modlgn_passwd\").value = \"\";";

  scriptString += "$get(\"modlgn_username\").focus();";

  scriptString += "}";

  scriptString += "}";

  scriptString += "function loginButton_Click() {";

  scriptString += "Sys.Services.AuthenticationService.login($get(\"modlgn_username\").value, $get(\"modlgn_passwd\").value, false, null, 'Home.aspx', loginCallback, errorCallback);";

  scriptString += "}";

  scriptString += "function errorCallback(error) {";

  scriptString += "alert(error.get_message());";

  scriptString += "}";

  scriptString += "</script>";

  Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "loginView", scriptString);

  }

  }

  
  Thanks again for your assistance with this.
  

  Reply

• Georgi Georgi

  Posted on Jul 21, 2009 (permalink)

  Hi Philip Senechal,
  
  

  Add return false; in the onclick handler of the submit button as shown here:
  
  

  <li id="form-login-button">

  <input type="submit" name="Submit" class="button" value="Login"

  onclick="javascript:loginButton_Click();return false;" />

  </li>

  
  The problem is that without return false;  a postback is being done.
  

  
  

  I hope this helps you.

  
  Best wishes,
  Georgi
  the Telerik team

  
  Instantly find answers to your questions on the newTelerik Support Portal.
  Check out the tipsfor optimizing your support resource searches.

  Reply

• dt uga

  Posted on Jan 14, 2010 (permalink)

  hello
  
  i have that code
  
  
  <div class="cd_moduletitle_logo"><a href="#"
      onclick="return hs.htmlExpand(this, { contentId: 'highslide-html-loginform', wrapperClassName: 'mod_cd_login', outlineType: 'rounded-white', align: 'auto', anchor: 'auto', dimmingOpacity: 0, slideshowGroup: 'mod_cd_login_loginform' } )"
      title="Login">Login</a></div>
  
      <div class="highslide-html-content" id="highslide-html-loginform">
  
  <div class="highslide-html-content-header">
  <div class="highslide-move"
      title="Move"><a href="#"
      onclick="return hs.close(this)" class="control"
      title="Close">Close</a>
  </div>
  </div>
  <div class="highslide-body">
  
  <form action="/app/index.php?option=com_user"
      method="post" name="cd_login_form_login" id="cd_login_form_login">
  <fieldset class="input">
  <div>
  <p id="form-login-username"><label for="modlgn_username">Username</label><br />
  <input id="modlgn_username" type="text" name="username" class="inputbox"
      title="Username"
      alt="username" size="18" /></p>
  <p id="form-login-password"><label for="modlgn_passwd">Password</label><br />
  <input id="modlgn_passwd" type="password" name="passwd" class="inputbox"
      size="18"
      title="Password"
      alt="password" /></p>
  
      
      <p id="form-login-submit"><input type="submit"
      name="Submit" id="cd_login_loginbutton"
      title="Login"
      value="" /></p>
      </div>
      </fieldset>
                  <ul>
      
          </ul>
      <input type="hidden" name="option" value="com_user" /> <input
      type="hidden" name="task" value="login" /> <input type="hidden"
      name="return" value="L2FwcC9pbmRleC5waHA/b3B0aW9uPWNvbV91c2VyJnZpZXc9bG9naW4mcmV0dXJuPWFIUjBjRG92TDJ4cGRtVXRaMkZ0WlhNdWRIWXZZWEJ3TDJsdVpHVjRNaTV3YUhBL2IzQjBhVzl1UFdOdmJWOWpiMjUwWlc1MEpuWnBaWGM5WVhKMGFXTnNaU1pwWkQwME5nPT0=" /> <input type="hidden" name="9c422afa92f78ca34bf2430235505717" value="1" /></form>
  </div>
   </div>
  
  
      </div>
  
      <div class="ja-cert">
          
      <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank" title="Site com CSS validado" style="text-decoration: none;">
          <img src="http://live-games.tv/app/templates/ja_purity/images/but-css.gif" border="none" alt="Site com CSS validado" />
          </a>
          <a href="http://validator.w3.org/check/referer" target="_blank" title="O site está validado como XHTML 1.0 Transitório" style="text-decoration: none;">
          <img src="http://live-games.tv/app/templates/ja_purity/images/but-xhtml10.gif" border="none" alt="O site está validado como XHTML 1.0 Transitório" />
          </a>
      </div>
  
      <br />
  
  
  anyone knows what is this?
  
  modlgn_username?
  cd_login_loginbutton?
  name="return" value="L2....?
  
  tks
  
  
  

  Reply

• Georgi Georgi

  Posted on Jan 15, 2010 (permalink)

  Hi dt uga,

  It looks like there is Joomla integration with your application. It's definitely not something coming from Sitefinity though.

  Sincerely yours,
  Georgi
  the Telerik team

  
  Instantly find answers to your questions on the new Telerik Support Portal.
  Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

  Reply

• dt uga

  Posted on Jan 15, 2010 (permalink)

  there is anyway for i find de password?
  

  Reply

Home / Developer Network / Forums / Sitefinity 3.x: Security > Javascript Login