Ajax.Form enhancement to Prototype.js
After using Prototype.js for a while, one shortcoming I’ve found is that it lacks the built-in ability to submit an entire form via AJAX. To remedy this, I created an addon to address this (available here: prototype.ajax.form.js). View the source on the example page to see usage. The only thing this addon does not do is submit file uploads… and I don’t think it’s possible to do so since access to the client’s computer via javascript is not permitted for security reasons. PLEASE correct me if I’m wrong, because I’d love to be able to do this.
Go here for a usage example.
The only way to do file uploads is to put in a specific-case where if there’s a file upload, you create a hidden iframe and POST to the iframe, and have the iframe run some javascript when it’s finished to tell the parent window that it’s done.
Check out a file uploader class I put together that uses prototype to do some polling uploads via a hidden iframe and a cgi on the server:
http://development.finetooth.com/?p=11
me: yeah, i thought of doing that as well, but the problem is that it doesn’t actually do it via a xmlhttprequest. But I guess it gets the job done.
Lindsey: Looks great!
Looks to be similar to how GMail does theirs. Keep up the good work.
For anyone coming across this now, Prototype 1.5.1 added the very handy Form.request method which will automatically wrap up your form and submit it via an AJAX request using the same semantics as Ajax.Request.
http://www.prototypejs.org/api/form/request
It’s very nice for doing the sorts of things Beau mentioned in the original article!
-Zach