One thing that might muck up your beautifully designed AJAX popups is the user repeatedly hitting the tab key, simple way of stopping this is by inserting a onkeydown event for the keypress..

Trapping TAB

Simple and effective, as soon as the user's cursor gains focus for the username textbox if they then try to hit TAB within it it won't do anything; effectively trapping the action dead.

Obviously if you've got two boxes (username + password), you'll want to put this kind of trap on the password textfield otherwise the user won't be able to tab to the next cell, but as a quick fix it works well.

Setting Focus

You can also set focus via...

$('username').focus();

Quick Note. Unlike Firefox, Internet Explorer handles password fields a little differently, blanking out whatever value you pass it within a 'value' tag.

So...

Will have a password box in Firefox starred out, but in IE it'll appear blank.

To get around this you can use Prototype to inject a value into the password field, so the user see's it as starred out.

$('mypass').value='**';

Note, if you're generating the form dynamically with...

var innerhtml='

Only fire your $('mypass') code after the form has been written to the page otherwise you won't be able to get a handle on it (most cases you won't ever have this problem).

Note to self: safari doesn't seem to like escaped characters being injected into an object within the DOM, seems to break them up.

So,

myObj.innerHTML = '<a onclick=\"do();\">execute</a>';

Comes out as...

<a onclick="; do(); ";>execute</a>

Doesn't happen in Firefox 2, IE6/7 or Safari 3 but fails in Safari 2.0.4

Using the Firebug addon YSlow from Yahoo I managed to tune site performance a little more by adding 'expires' to the nginx.conf file

location ~* ^.+.(jpg|jpeg|gif|js)$ { root /var/www/apps/myapp/public; access_log off; expires 30d; }

What this basically does is tell NGINX that any files of type jpg, jpeg, gif, and js with the root dir specified shouldn't be logged for access and have an expires value set to 30 days.

As most of the images I use on-site don't change that much this works perfect for me.

Updated my NGINX example files in the [CODE DOWNLOADS] area so you can grab a copy.

More tips located at...

• Zhesto Nginx notes
• Nginx Full Example 1
• Nginx Full Example 2

Here's a nice little addon to the Prototype Ajax library that adds the ability to trim text, etc. with Prototype.

First add this to one of your .js include files,

String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g,"");
}
String.prototype.ltrim = function() {
    return this.replace(/^\s+/,"");
}
String.prototype.rtrim = function() {
    return this.replace(/\s+$/,"");
}

now with protoype loaded you can trim your text simply and effectivly,

$('myfield').value.trim() == '';

this will simply get the value from the textbox 'myfield', trim it for whitespace and then compare it to see if it's empty.

Sweet!

Thanks goes to SOMACON.COM for this one.