The Latest and Greatest…

I’m going through some little mini-demos I did for Ajax testing and I’m coming up with some …guidelines of sorts. On the other hand, this might just be a string of mildly random thoughts on the topic. Well, whatever it is, here’s what I’m thinking:

Building robust Ajax apps could mean a lot more coding and perhaps even some logic duplication between the client and server. I’m thinking though that a good way to do things would be to put as much of the logic as possible on the server-side and hit them through asynchronous function calls. If a client’s browser supports JavaScript, everything will be just peachy–if not, you’d have to handle whatever processes you’re handling on the server-side anyway.

In related news–ha, I’ve noticed a lot of developers will give anchors (the “a” tag) with onclick event handlers href attributes like href="#" or href="javascript:whatever();". Visitors using browsers with JavaScript disabled will render these links useless and probably quite frustrating. A solution to this problem is to make the href a link to a page that will actually do something and make sure the onclick returns false. For example: <a href="logic.php?task=deleteRecord&id=123" onclick="deleteRecord('123'); return false;" id="delete_link" >Delete</a>.  Even better, attach your event handlers programmatically when the DOM finishes.

// external javascript:
var deleteLink = document.getElementById('delete_link');
deleteLink.onclick = function() {
   deleteRecord(123);
   return false;
};

// or with jQuery, you could do:
$('#delete_link').click(function(){
   deleteRecord(123);
   return false;
});

Another use for this is in form submissions. Don’t put an onclick on a form’s submit button. Submitting the form by other means will completely bypass whatever validation you have in place. Instead, put an onsubmit event handler in the form tag and return whether or not it passed or failed. The submit button can then be event handler-free and your validation code will run if someone hits the return key or if they tab to the submit button and hit the spacebar… whatever.

For example, make your form tag like this: <form id="…" action="…" method="…">…</form>.  Just make sure that your validation function returns true or false and for the love of Pete, use labels with your inputs!

This entry was posted on Thursday, October 19th, 2006 at 6:41 AM and is filed under Web Development. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.