Domino 2.0 Rich Internet Applications with IBM Lotus Notes/Domino
You are here: Today » Adding a user registration system to my blog
« Adding document counts with Ajax
And there was Ajax... unobtrusively entering Domino 2.0 blog »

Adding a user registration system to my blog

Adding a comment system to a Domino web template is easy. The tricky part is making a Cookie based security system to restrict actions to registered users only. Since this blog is one of the many websites on my company's hosting server, I wanted to avoid having real Notes security with users registering in the Name and Adress book.

Allow users to register

I used a registation page with a nice XHTML form. When you use content type 'text/html', you cannot have Notes forms or documents in edit mode. When you create your own HTML form however, you still can create and update documents! So I used a dummy navigator with a navigator template to hold the form HTML: 'registration'.

<form method="post" action="<Computed Value>" name="_User" class="niceform">
        <label for="usernamefld">Name:</label>
        <input name="InputUserName" id="usernamefld" value="" />
        <label for="pwfld">Password:</label>
        <input type="password" name="InputPassword" id="pwfld" value="" />
        6 characters minimum
        <label for="pw2fld">Again:</label>
        <input type="password" name="InputPassword2" id="pw2fld" value="" />
        your password again
        <label for="emailfld">E-mail: </label>
        <input name="InputEmailAddress" id="emailfld" value="" />
        required, never published
        <label for="websitefld">Website: </label>
        <input name="InputWebsite" id="websitefld" value="http://" />
        <label for=""></label>
        <input type="checkbox" name="RememberMe" class="check" checked="checked" value="1" />
        Remember me on this computer
<p class="buttons">
    <input type="submit" value="Submit" />
    <input type="button" value="Cancel" onclick="location='<Computed Value>'" />

Styling the registration form with CSS

/* nice form */
.niceform{background:#ddd;border:solid 1px #c90;padding:5px}
.niceform ul{margin:5px 0;padding:0}
.niceform li{list-style:none;clear:both}
#newcomment p{text-align:center;margin:0}
p.buttons input{width:80px}

Validating the user

The registration form posts to user?createdocument. Three computed for display fields hold all the action: Validation, SaveOptions and $$Return. I just used a very simple validation method: when everything is ok, the document saves and the user is returned to where he came from. When not validated, a simple (ugly) message is shown. Later on, I will use Ajax to do this much nicer and without getting pages from the server.

rem "Validation";

a1:=@DbLookup(""; ""; "(users)"; @LowerCase(a);2);
@If(@Length(a)>5 & !@IsError(a1); @Return("The username <em>"+a+"</em> already exists. You have to choose another one."); "");
ch1:=@If(@Length(a)<5 | !@Contains(a; " "); "You have to enter your full name."; "");
ch2:=@If(@Length(b)<6 | b!=InputPassword2; "The password was not valid. "; "");
ch3:=@If(@Length(c)<9 | !@Contains(c; "@") | !@Contains(c; "."); "not a valid e-mail address"; "");

rem "SaveOptions";
@If(Validation=""; "1"; "0")

rem "$$Return";

a:="<h1>Registration error</h1>"+@NewLine
+"<p>Please go back and check the following:</p>"+@NewLine
+"<a href=\"javascript:history.go(-1)\">< Back</a>";

@If(SaveOptions="0"; @Return(a); "");

cookieForEver:="; expires=Fri, 1 Jan 2106 11:00:00 UTC; path=/;";
b:=@SetHTTPHeader("Set-Cookie"; "username="+@URLEncode("Domino"; InputUserName)+cookieForEver);
a:=@SetHTTPHeader("Set-Cookie"; "usr="+id+cookieForEver);
c:=@SetHTTPHeader("Set-Cookie"; "remember="+RememberMe+cookieForEver);
"["+@Middle(Query_String_Decoded; "&b_to="; "&")+"]"

The login page

The login is treated the same way: a navigator to hold the login form. It posts to a form weblogin that never saves. And again: this will be Ajax in the near future. Why not build the user registration in Ajax from the start? It's called non-obtrusive JavaScript: the pages have to be usable without it.

Star rating



To add a comment, log in or register as new user. It's free and safe.