jQuery Ajaxify Lite

I’ve been using the ajaxify plugin for a while now and felt it needed an update.

Since .live() is supported for more events now, I thought it was time to get it working how I always wanted it to work.

Using the same syntax on links as before, you can specify the target div, using the target=”” attribute and the url is automatically extracted from the href=”” or action=”” attribute meaning you can keep your code simple and valid but have easily Ajax populated content, as since I’m using .live() any future links/forms that match the original selector will continue to be ‘ajaxified’.

There’s a demo here and source code too, as ever.

Also available through Google Code.

jQuery Ajaxify – Update

I’ve been doing more work on the jQuery AJAXify plugin, it’s now a lot more robust (I think…) and I’ve squashed a few bugs that were in the previous version (with help from Andrea Battaglia) along with adding in a few new features (with their own bugs no doubt!).

Theres an updated test page and as ever a direct link to download here.

Check out the test page to see the new features!

Edit: Further updates, all links have been updated to version 0.3b. Added (and documented existing) callbacks as requested by Sebioff! And a further fix for the ‘append’ option. Also fixed IE6 compatibility.

Further Update: Another update after the comment from David Lee about $(‘form’).serialize();

Another Further Update: I have set up a Google Code repository for this plugin, which states that this code is released under the MIT license.

Update October 2010: I have updated this plugin for jQuery 1.4.3 as a ‘lite’ version.

jQuery Ajaxify

Probably not the first person to implement this, but I wanted to make an automatic form AJAX-‘ifier’ that could capture which submit button had caused the submit event to be fired too.

It’s implemented fairly simply:

$('form').ajaxify();

There’s a demo page or you can just download it and have a look.

Update: As pointed out by Andrea in the comments below, this would return the value of radio and checkboxes even if they weren’t selected. I have released 0.1a and updated the link above to fix this issue. Thanks Andrea!

Update 2: I have updated this plugin, view this post for more information.

Update October 2010: I have updated this plugin for jQuery 1.4.3 as a ‘lite’ version.

submitEvents – Javascript form submission handler

Something that I seem to be doing a lot lately, is writing a handler for processing the submission of a form, and since mootools is the JS framework of choice, I’ve written this little class that handles the onsubmit of a form and adds some useful features.

  • Confirmation – Provides an Ok, Cancel input box before proceeding further
  • Submit Button – Disable and change the text on a submit button
  • Information Div – Display a div that lets the user know something is happening
  • Undo – Undo the changes (re-enable a previously disabled submit button, change the information div) that have been carried out by the class
  • AJAX – Submit the form using AJAX instead of the ‘old fashioned’ way

All these should be easily implemented using the class.

Examples are provided in examples.html.

As previously, this work is released under the creative commons share alike license.

Download submitEvents 0.1 (31.9k) (Includes mootools 1.2)

Edit: I really do dislike internet exploder… The above version failed in IE6 (mootools’ form.toQueryString() function). I’ve updated the code to 0.11 which can be found here:

submitEvents 0.11 (32.8k) (Includes mootools 1.2)

Edit 2: Ok, so my hatred for IE, although deserved, was unnecessary in this situation…

I’ve updated the code to use mootools .bind(this) on the ajax onComplete function, this fixed the main problem with IE6 and makes the code look much cleaner. Also the examples file is now PHP instead of static HTML and returns a var_dump of $_POST when the form is submitted.

PS. This will be the final update to this post!

submitEvents 0.2 (32.3k) (Includes mootools 1.2)