Archive for the ‘JavaScript/Ajax’ category

Neither do I like writing JavaScript nor enjoy it; however, I often find it necessary to use a little bit of the slide-down effects or create a user-friendly navigation interface based on JaaScript.

Ajax Comment Posting

Tuesday, August 14th, 2007

When I installed WordPress a few weeks ago, I didn’t think it would actually be my blogging system (as I don’t like people who write a script and don’t update the code for 10 years saying “we’re making WordPress backwards compatible!”). However, I eventually liked it. And I have an old custom - whenever I like something, I write a plugin to make it even better ;) And so I did.

Ajax Comment Posting will post your comments in an Ajax-way, without refreshing the page. It’ll also validate the comment form on the client and server side. I also worked a bit on the compatibility with older WP version, and so even v1.5.2 users can enjoy ACP! It was supposed to be just a simple comment-posting plugin, but I’ve got some emails complaining that it and the Ajax Edit Comments plugin can’t co-exist, so in a month’s time ACP’s functionality will be extended to allow users and admins to manage comments (in an easy, Ajax way). Thanks to Gene Steinberg for suggesting the further development of the plugin, and to Rayne Bair for pointing some errors - they all will be fixed in the forthcoming version of ACP.

You can read more about the plugin and see some screenshot on its page on regua.biz or in the WP plugin directory. Any suggestions are welcome.

Edit: ACP has been downloaded over 3,000 times! Thanks for your support and help with the plugin.

jQuery

Friday, July 20th, 2007

I’ve always been using script.aculo.us to handle all the fancy JavaScript and AJAX stuff on my site. Recently, though, I noticed that regua.biz takes a terrible lot of time to load, due to the size of the framework. I’ve tried jQuery and it works nice for me (so far).

jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.

 

jQuery.com

 

jQuery code is easier to write than script.aculo.us’ in my opinion. In the latter, the dollar sign ($) was just a shortcut to getElementById function, whereas in jQuery the dollar function works like a CSS selector - you write $('#div') to select the element with ‘div’ id, $('div') to select all div elements, and $('div li') to get all the li elements inside a div or even $('a[@href*=/content/gallery]') to select all links containing “/content/gallery” in their href attribute. I really like the idea. Writing any code is easier when you don’t have to use functions like getElementsByClassName() or getElementById() (who’s invented such long names and what for?), not to mention implementing the CSS-like selectors in JavaScript.

The jQuery JavaScript library contains the following features:

  • DOM traversal and modification (including support for CSS 1-3 and basic XPath)
  • Events
  • Effects and animations
  • Ajax
  • Extensibility

Wikipedia

jQuery allows you to use brilliant event-related function, like $(document).ready() which is a better form of window.onload (the latter waits until all images have been loaded, the former doesn’t). Also, it solves the old problem of altering CSS properties in JavaScript by giving you a great css() method. For instance, $("p").css("color","#f00"); would change the font color in all paragraphs to red. As simple as it is.

The effects, which are kind of a standard among JS libraries nowadays, are done good (just good) in jQuery. There’s nothing wrong with them, but there’s nothing unusual either. I have to admit that script.aculo.us has a bigger collection of effects available, but I still prefer to get a little bit less animations than use a 60 kB framework.

Among other jQuery’s advantages are a great co-operation with other libraries (prototype, YUI), great DOM traversing and manipulation, plugin support… oh, just try it yourself, I assure you it’s great fun to use it on your website. You can admire jQuery in use here, in the site preferences settings (accessible via the main menu) or in the AJAX-based comment posting.