When I first wrote MooTools ElementFilter, I didn’t think much of it. Fast forward eight months later and I’ve realized I’ve used the plugin a billion times. Hell, even one of the “big 3″ search engines is using it for their maps application. There’s one more place I’d like to use it. My employer uses a basic SPAM filtering system which allows me to see emails that were incorrectly (or correctly) caught in SPAM, click a checkbox, and click a “Deliver” button. The problem is that it will catch a bunch of valid emails with very similar subject lines, so I have to hunt down all of the emails, check the email’s checkbox, and keep searching. Inefficient to say the least. That’s why I’ve used ElementFilter to find LABEL elements with the given search text and automatically check their checkboxes.
Usability / Accessibility Archives
Checkbox Filtering Using MooTools ElementFilter
iPhone-Style Passwords Using MooTools PassShark

Every once in a while I come across a plugin that blows me out of the water and the most recent culprit is PassShark: a MooTools plugin that duplicates the iPhone’s method of showing/hiding the last character in a password field. This gem of a MooTools plugin, which conquers some problems that plague jQuery counterparts, was authored by valued MooTools contributors Luis Merino and Nathan Querido.
The MooTools PassShark Usage
window.addEvent('load',function() {
new PassShark('pass',{
interval: 300,
duration: 1500,
replacement: '%u25CF',
debug: false
});
});
The only required parameter is the ID of the input/password element you’d like to act as an iPhone password field. Options include:
New York Times-Style Text Selection Widget Using MooTools or jQuery

Aaron Newton made a great request to me last week: why not make my MooTools Documentation Bookmarklet function more like the New York Time’s text selection widget. NYT’s text selection widget listens for text selection and presents the user with a “search” icon they may click on to learn more about that term. I’ve tried to answer that challenge — not in bookmarklet form but in website widget form.
Javascript Copy to Clipboard
Providing your users the ability to copy text to the clipboard can make your website much more convenient and valuable. Unfortunately Flash 10 broke most of the methods for doing so. Luckily a great library named ZeroClipboard exists. ZeroClipboard uses a pinch of Flash and touch of javascript to make copying to the clipboard happen.
The Sample HTML
<script type="text/javascript" src="ZeroClipboard.js"></script> <textarea name="box-content" id="box-content" rows="5" cols="70"> The David Walsh Blog is the best blog around! MooTools FTW! </textarea> <br /><br /> <p><input type="button" id="copy" name="copy" value="Copy to Clipboard" /></p>
The above HTML features a form element with the ID “box-content” and a button with the ID “copy”. Both of those element IDs will come into play with ZeroClipboard.
Form Element AJAX Spinner Attachment Using jQuery
Yesterday I showed you how to attach an AJAX spinner next to a form element using my beloved MooTools. Today I’ll show you how to implement that same functionality using jQuery.
The XHTML
<select class="ajax"> <option value="">-- Select a Site--</option> <option value="David Walsh Blog">David Walsh Blog</option> <option value="Script & Style">Script & Style</option> <option value="Band Website Template">Band Website Template</option> </select> <br /><br /> <input type="text" id="my-text" class="ajax" />
Elements with the “ajax” CSS class will be our target.