In the effort to make posting to this blog as quick and easy as possible, I decided to take a shot at a jQuery/CF automatic login routine...

Not wanting to mess with the built-in authentication (and looking for a quick easy fix), I took the most simple approach I could think of - put the user name and password in the url as variables, put those values in the form fields with ColdFusion, and then submit the form with jQuery.

Here's how I did it

1) The Url Variable part

Assuming your blog login is, you will want to simply pass the 'un' and 'pw' variables in the url, like this:

Then, in the 'login.cfm' file that holds the blog login form, set up some parameters. Note: to avoid fighting the 'enablecfoutputonly' setting, i just put this at the very top of the file.

view plain print about
1<cfparam name="login.un" default="">
2<cfparam name="" default="">

Then, if we've got the variables in our entry url, let's set some variables based on the values - right below those other two lines ...

view plain print about
1<cfset login.un = "#url.un#">
2<cfset = "">

Now we have the url variables as 'un' and 'pw' in a new 'login' scope.

2) Change the Form

I gave the submit button an ID (so we can get it with jQuery), and set a value for the two input fields, based on our variables set above. To make it easy, here's the whole modified form

view plain print about
2    <tr>
3        <td><b>#application.resourceBundle.getResource("username")#</b></td>
4        <td><input type="text" name="username" value="#login.un#"></td>
5    </tr>
6    <tr>
7        <td><b>#application.resourceBundle.getResource("password")#</b></td>
8        <td><input type="password" name="password" value=""></td>
9    </tr>
10    <tr>
11        <td>&nbsp;</td>
12        <td><input type="submit" id="submitForm" value="#application.resourceBundle.getResource("login")#"></td>
13    </tr>

3) Click the Button with jQuery

Now, when we show up at the page, the form fields are prefilled, based on the 'un' and 'pw' variables in the url.

All that's left is to click the button...

At the very top of the file, just below the and lines above, I added this (note: this assumes we have a copy of jquery.js in a folder called 'js', change to suit)

view plain print about
1<cfif url.un neq '' AND neq ''>
2<cfsavecontent variable="hcode">
3<script src="js/jquery.js"></script>
4<script type="text/javascript">
10<cfhtmlhead text="#hcode#">

This puts jquery into the head of our page, along with the script we need to click the button. Done. Logged in. Ready to post!

4) One Less Step...

As an additional time-saver, I set my blog's index page to direct to the 'new entry' screen, like this (put this at the very top of index.cfm)

view plain print about
1<cflocation url="entry.cfm?id=0" addtoken="no">

5) One More Less Step...

And here's another click removed - focus the 'title' field as soon as the page loads! Just put this code at the very top of 'entry.cfm'

(note: for some reason the focus only works in IE , at first test... gotta be an extension conflict on my end, jquery focus works fine in FF!)

view plain print about
1<cfsavecontent variable="hcode">
2<script type="text/javascript">
8<cfhtmlhead text="#hcode#">

I dunno about you other bloggers but 90+% of the time I go to my blog admin, I am looking to make a new post. This makes it super easy. By simply bookmarking , I can click a link in my bookmarks, and start typing a new post, shhhhnap!