Hide and automatically check [Sign me in automatically] check box in SharePoint FBA login page

  • Article

Why to hide and check "Sign me in automatically" button?

Main reason is to facilitate smooth user experience, especially with respect to Microsoft Office Integration with SharePoint. This integration issue is extensively covered by Steve Peschka's MSDN article on FBA (Part 2 of 3).

Issue:
WhenWindows SharePoint Services web application is extended with FBA then the MS Office Integration isn't that smooth and there are some extra steps involved working with Office Documents such as Manually check-out, check-in, download temporarily to desktop then edit and upload etc.

Solution (or rather a workaround):
One of the work around to smoothen this experience is to check "Sign me in automatically" checkbox which sends the persistent cookie and thus Office programs works smoothly by using that cookie.

You might ask isn't that a risk to allow user to keep them signing in without their knowledge? Yes, but that's the trade-off. I am not saying compromise the security but its the happy middle ground for seamless user experience.

Steps to modify login.aspx page:

  1. Create a sub-directory (myApp) in 12 hive's layouts directory (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\template\layouts)

  2. Copy login.aspx file to this sub-direcroty from parent directory (layouts directory) and rename it to myLogin.aspx.

  3. Modified myLogin.aspx page as shown further.

  4. Change web.config file of the FBA Web application to redirect login.aspx page to your custom page (/_layouts/myApp/myLogin.aspx) as shown below

    <authentication mode="Forms">
    <forms loginUrl="/_layouts/myApp/myLogin.aspx" />
    </authentication>

Modify myLogin.aspx page.
First hide the checkbox  by adding  style="display:none;" attribute to <td colSpan=2> tag which surrounds check box. Replace <table class="ms-input"> tag with following: <table class="ms-input" onmousedown="javascript:for(var i=0;i<document.forms[0].elements.length;i++){if (document.forms[0].elements[i].type=='checkbox'){document.forms[0].elements[i].checked=true;break;}};" onkeypress="javascript:for(var i=0;i<document.forms[0].elements.length;i++){if (document.forms[0].elements[i].type=='checkbox'){document.forms[0].elements[i].checked=true;break;}}">

What's happening here?
Yeah, I know its hard to read. All I am doing is trapping onmousedown and onkeypress event on main table tag which surrounds User Name and Password text boxes, so that anytime user either enters user name or password or even copy/paste (using mouse or CTRL+V) this is sure way to fire the script and then it automatically checks the check box.

What's this in-line javascript doing?
Instead of using hard-coded ID for the check-box , I am looping through the form elements and enabling first checkbox upon key press or mouse down. Of course, assuming that "sign me in automatically" check box is first in the form element (you may want to tweak if you have extensively customized this OTB form and created your own with multiple check-boxes)

 

 

Why in-inline Javascript and why not simply add property Checked="true" in <asp:checkbox> control?
Because Checked="true" doesn't work, as on form load checkbox gets initialized and by default its unchecked. Secondly, in line javascript is allowed in SharePoint pages, however <script> tag is restricted dues to security reasons.

Hope this may save some hours for some of you. Just sharing the point for SharePoint :-)