Categories
Posts

Introducing jQuery Edit In Place (JEIP)

The first version of jQuery Edit In Place (JEIP) is ready. The UI and features basically the same as my older Prototype based edit in place code, with a few extra tidbits thrown in for good measure.

It works in the typical jQuery style, as a plugin off of the main jQuery object. Here’s a simple example that makes all elements with a class of ‘edit-this’ editable and sends the form data to ‘save.php’:

[sourcecode language=”javascript”]
$( “.edit-this” ).eip( “save.php” );
[/sourcecode]

Check out the JEIP page for a details on what data the XHR includes and what the expected response needs to be. There’s also a long list of options that the eip function supports.

You can dive in by taking a look at this basic demo and then downloading version 0.1.0 of jeip.js.

8 replies on “Introducing jQuery Edit In Place (JEIP)”

Awesome, I’ve been looking for exactly this for some time now! I am a big fan of edit-in-place interfaces, I think they are the way forward for making Web sites easy to administrate as it avoids the user having to learn a completely different interface UI for administration.

I just happened to stumble across your blog from reading your old blog post describing how to do recursive search-and-replace in a Perl one-liner.

Look at the XHR in Firebug, the “html” field in the JSON string is returning an empty string. That wouldn’t prevent the “Saving…” text from being removed though. Have you tried this on an empty page? Perhaps there’s something else on the page that’s causing the problem.

If you can pin down what’s going on please contact me (http://josephscott.org/contact/). I’m happy to fix bugs in the code.

Leave a Reply

Your email address will not be published. Required fields are marked *