#Jintastic

Jintastic is a jQuery based in-place editor generated by Formtastic.

Features

• easy usage
• you can reuse your partials and controller actions
• you can edit more than one attribute at once
• you can use nested resources

Install

Gem

It’s hosted on Gemcutter, so you’ll need to set that up first, if you haven’t already: gem sources -a http://gemcutter.org/

sudo gem install jintastic 

Add Jintastic as a dependency in your environment.rb file:

config.gem 'jintastic' 

Plugin

script/plugin install git://github.com/rubymood/jintastic.git

After Jintastic gem or plugin installed generate jintastic assets

script/generate jintastic

Usage

Having downloaded jQuery(>=1.3.2) include jintastic in your template:

<%= javascripts_include_tag 'jquery', 'jintastic' %>

Example

Let's say you have a bookmark resource and you have this haml files:

# bookmarks/index.html.haml
%ul
  = render @bookmarks

# bookmarks/_bookmark.html.haml
%li
  = bookmark.name

# bookmarks/edit.html.haml
-# with formtastic
- semantic_form_for @bookmark do |f| 
  -f.inputs
    = render :partial=>'form', :locals=>{:f=>f}
    = f.commit_button 
-# or with default form_for helper
- form_for @bookmark do |f|
  = render :partial=>'form'
  = f.submit_tag 'Save'

# bookmarks/_form.html.haml
-# with formtastic
= f.input :name
= f.input :url
-# or with default form_for helper
= error_messages_for :bookmark
= f.text_field :name
= f.text_field :url

This is simple. If you organize your views in this way you just follows the rails conventions. Now if you want to in-place editing a bookmark inside your index page just simply do one of the below:

# bookmarks/_bookmark.html.haml
%li{:id=>dom_id(bookmark)} # we are referencing the id later in a js file (see below)
  -# this shows name attribute, and if you click on it, you can edit it
  = in_place_editor_for bookmark, :name
  -# this shows name attribute, and if you click on it, it will show your bookmark form partial
  = in_place_editor_for bookmark, :name=>:form
  -# this shows name attribute, and if you click on it, it will show your custom form partial
  = in_place_editor_for bookmark, :name=>'bookmarks/custom_form'
  -# this shows name attribute, and if you click on it, you can edit both the name and url attributes
  = in_place_editor_for bookmark, :name=>[:name, :bookmark]
  -# so you can edit something else (this shows name attribute, but when you click on it, you will edit the url attribute)
  = in_place_editor_for bookmark, :name=>:url
  -# and finally, you can add nested resource
  = in_place_editor_for [:admin, bookmark], :name

Inside your bookmark controller you have to make nothing new. The only thing you have to do is some javascript magic:

# bookmarks/update.js.erb
$('#<%= dom_id @bookmark %>').replaceWith('<%= escape_javascript render @bookmark %>')

And finally, what happens at validation error?

With formtastic input helper the validation errors will be displayed automatic. If you use rails default input helpers you could display the errors in your form partial (see above in the example).

TODO

• some options to customize in place editor form
• make some tests

Copyright (c) 2009 Nandor Komzak, released under the MIT license