Ajax and Ajax Frameworks

I have been a developer for nearly 20 years and a web developer for about 10 years. Over the years, I have considered creating a blog to share the things I have learned (and am learning) about web design and development, but I never seemed to have the time. When I began learning about web development using Ajax and Ajax Frameworks, I decided to take the time to create this blog.

My intention for this blog is to focus primarily on Ajax Frameworks, but since web development requires knowledge of many technologies, I will occasionally write about things such as CSS, Javascript, PHP, MySQL, Flash, etc.

Lately, I have been using JQuery as my primary Ajax tool. Although I have used other Ajax Frameworks in the past (Dojo Toolkit, Yahoo! User Interface Library, Scriptaculous/Prototype), JQuery has thus far been the easiest to learn. In my first few posts I will discuss some of the JQuery Plugins that I have created. Some of these include: a plugin for Google Maps (jquery.imGoogleMaps), Form validation and submission (jquery.imValidateForm), Page Populater (jquery.imPagePopulate), and a plugin to create lists (jquery.imList).

While I am still learning about some of the other Ajax Frameworks, I hope that what I have learned will be helpful to others. Just remember, “When you can pull the pebbles from my hand…”

YUI Selector Utility: CSS3 Attribute Selectors and Pseudo-classes

Saturday, March 28th, 2009

I have been using the YUI Selector Utility for a few months, but I just recently discovered how powerful it really is. I have been converting my imValidateForm JQuery plugin into a YUI widget. One of the validations this widget checks is whether a set of radio buttons are checked. I originally created validation object with pure Javascript. To determine whether the radio buttons were checked, I created the following code:

^?View Code JAVASCRIPT

var flds = document.getElementsByName(‘gender’);
var nL = flds.length;
for (var j=0; j&lt;nL; j++) {
     if (flds[j].checked) {
          ischecked = true;
          break;
     }
}

This is so verbose when compared to the YUI implementation of the same code:

^?View Code JAVASCRIPT

var ischecked = (YAHOO.util.Selector.query('input[name=gender]:checked').length &gt; 0) ? true : false;

Not only am I able to use the CSS3 Attribute Selector and Pseudo-classes, I can combine the two to create more succinct code. Marvelous.

Categories: Ajax, Pebblet, YUI
You can follow any responses to this entry through the RSS 2.0 feed.
You can leave a response, or trackback from your own site.

2 Responses to “YUI Selector Utility: CSS3 Attribute Selectors and Pseudo-classes”

Philip Says:
March 28th, 2009 at 7:41 pm

I think the ? true : false; part isn’t really needed, since the expression in parentheses is boolean, and will return true or false anyway. You can reduce it to this:

var ischecked = (YAHOO.util.Selector.query(’input[name=gender]:checked’).length > 0);
admin Says:
March 28th, 2009 at 8:19 pm

Good to know. Thanks for the pebble. I guess we are all grasshoppers .