Showing posts with label yui. Show all posts
Showing posts with label yui. Show all posts

Why I switched back to Prototype from YUI

While I love YUI's documentation, I just can't help but prefer this:

function checkExistingNamesRequest(name, value){ var div = 'checkExistingNames_'+name+'_container'; loading(div, "existing "+name+" names"); var myAjax = new Ajax.Updater( div, "./checkExistingNames.cgi", { parameters: $H({ name:name, value:value }).toQueryString() } ); }

To this:

var svrCheckExistingNames = "checkExistingNames.cgi"; var checkExistingNamesSuccess = function(o, n) { if(o.responseText !== undefined) { $('checkExistingNames_'+n+'_container').innerHTML = o.responseText; } } nameHandler = function(o) { checkExistingNamesSuccess(o, this.name); } var clientTest = nameHandler.bind({name: 'client'}); var projectTest = nameHandler.bind({name: 'project'}); var collectionTest = nameHandler.bind({name: 'collection'}); var collrefTest = nameHandler.bind({name: 'collref'}); function checkExistingNamesRequest(n, v){ $('checkExistingNames_'+n+'_container').innerHTML = "Checking existing "+n+" names... <img src='../icons/loading.gif' border=1>"; var test = clientTest; if (n == 'project') test = projectTest; if (n == 'collection') test = collectionTest; if (n == 'collref') test = collrefTest; var request = YAHOO.util.Connect.asyncRequest('GET', svrCheckExistingNames+"?name="+n+"&value="+v, {success: test, failure: test}); }


Which do you think is more maintainable?

(Frickin' Blogger is not meant for code, is it?!?)

Code-writing euphoria

I have a CGI that wants to validate a series of fields using Ajax.

I'm currently testing out the YUI toolkit. ...To be honest, I prefer Prototype, but I do want the breadth of knowledge to use both (and, next, I'll pick up dojo).

Anyway, back to the fields: there are three of them: client, project, and collection. I need to test if any of these fields have already been used (meaning: what the user enters must be unique), and I'm using Ajax to test this.

At first, I had a rat's nest of code, with basically a callback, handler, and response function for each one of the three. This, of course, made my teeth itch.

I tried refactoring, but I ran into the ubiquitouos scope problem in JS: I needed a closure around my "name".

After wrestling with it for two hours, this is what I ended up with, and it works beautifully:


//
// Check the existing names (client, project, collection):
//
var svrCheckExistingNames = "checkExistingNames.cgi";

nameHandler = function(o) {
checkExistingNamesSuccess(o, this.name);

}
// Stolen from Prototype:
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
var clientTest = nameHandler.bind({name: 'client'});
var projectTest = nameHandler.bind({name: 'project'});
var collectionTest = nameHandler.bind({name: 'collection'});

function checkExistingNamesRequest(n, v){
$('checkExistingNames_'+n+'_container').innerHTML = "Checking existing "+n+" names... <img src="../icons/loading.gif%27" border="1" />";
var test = clientTest;
if (n == 'project') test = projectTest;
if (n == 'collection') test = collectionTest;
var request = YAHOO.util.Connect.asyncRequest('GET', svrCheckExistingNames+"?name="+n+"&value="+v, {success: test, failure: test});
}
...Why is it such a PITA to post code on Blogger? ...There must be a trick I'm not getting. (I'm using blockquote tags for nesting here!)