I spent the better part of yesterday tracking down a jQuery plugin problem. I was trying to implement the Dialog plugin, which, on paper, looks to be as simple as it can get. However, I kept getting these stupid “$_.widget is not defined errors”, which made no sense. ui.core.js was included.

The upshot is that I was using a single mega-include to add all the plugins I neede for all the pages. I moved to a system whereby each page loads only those plugins it needs. I’m still not sure exactly why, but something about the loading of the 12 or 15 other plugins had stepped on the toes of the jQuery UI plugin.

Shorter: don’t use a single include for all your jQuery plugins. Add them as needed.

UPDATE: getting validate() to work with ajaxForm() was really easy. I’m loving life. All I had to do was add one level of redirection to the ajaxForm call:

$("form").submit(function() {
$(this).ajaxSubmit();
return false; // prevent default
});

One gotcha: it’s easy with these Ajaxy development paradigms to forget the essentials. For this to work in a “batch” mode (i.e. all at once, instead of item by item), you need to make sure your form elements have the name= attribute. I’ve gotten lazy and used to using #ids pretty regularly.

One other thing I’m currently working on: getting it to coexist peacefully with the jQuery Forms plugin. I’m sure there’s some way I can interrupt the ajaxForm method from being called if I run into a validation error.

Get the poop on JQuery version 1.2 over here at Scribd.  Nice work, Peter Bengtsson!

I ran into an odd bug with JQuery/IE/XSLT recently that might help some of you out.

The problem had to do with JQuery selectors. $(”.tag”) worked in FF 3, but didn’t work at all in IE 7. The HTML and Javascript were being loaded asynchronously via Ajax, so I fiddled around with $.getScript(), callback functions, setTimeout(), etc. to try to give IE time to “find” the tags that I wanted to work with. Nothing worked.

It turns out that the problem was the generated HTML that was being returned from the Ajax call. I was using an XSLT stylesheet to transform some data and had a little section like this:

<xsl:element name="div">
<xsl:attribute name="class">
tag
</xsl:attribute>
<xsl:attribute name="foo">
<xsl:value-of select="id"/>
</xsl:attribute>
<xsl:element name="a">
<xsl:attribute name="href">
void(0)
</xsl:attribute>
<xsl:value-of select="value"/>
</xsl:element>
</xsl:element>

What was happening was that the XSLT processor (ASP.NET’s XslCompiledTransform, if you’re interested) was spitting out a bunch of whitespace and encoded newlines, which I can’t get WordPress to format correctly or else I’d show you the output.

Firefox could wade through this nonsense to strip out the irrelevant whitespace and carriage returns. IE 7 couldn’t. Fixing up my XSLT to not indent my code for readability (gah) fixed it on IE as well.

UPDATE: Well, the first ding occurred quickly: ReinH’s lightweight version doesn’t work (for me) on IE7/Vista.  A couple others have noted it as well.  Moving on to Dylan’s version next.

I’ve been searching around for different autocomplete plugins for JQuery. I’ve found four leading contenders:

It appears that Jörn’s version is the Swiss Army Knife of autocompleters – you can even show images. Pretty cool. But is it worth 27K if I’m not using that functionality?

What I’ll probably do is start with the 3K version until it proves itself too limited (if it ever does). Let’s follow the XP principle of “do the simplest thing that could possibly work.”

I am getting the following error when using Blair Mitchelmore’s Query String Object plugin if the requested value is not present in the query string:

$.query.get(”s”) // s is not in the query string

The bug is filed here.

Check out this new plotting interface for JQuery.  Have you always shied away from charting because of the cost or the complexity?  Get up and running in 10 minutes with Flot.  It’s that easy.

Flot is currently on release 0.3 (call it a beta), and is hosted at Google Code under an MIT license.  The development thus far has been mainly done by a Danish company named iola.  Nice work guys!

Check out this tutorial by Jörn Zaefferer. You won’t be disappointed if you’re looking to begin development with jQuery.

Blogged with Flock

Tags: jQuery