in_place_editor on rails 2.0 and rjs templates
All right. The in_place_editor is gone from rails 2.0 as everyone knows, so now we need to install it as a plugin. No problem. But I needed something particular this time: On this site you can upload pictures and make them password protected. So I had the in_place_editor for the password, and right below it a link pointing to the picture with the password (if you sign up you can see it) like this:
[Picture is password protected:] (in_place_editor) verydifficultpassword
[Link to this picture with password:] click
When a user updates the password, I wanted the link to update as well.
To do it I had to call the in_place_editor with :script => true like this
<span>
Picture is password protected:
<span id="picture_pass_prot">
<%=h @picture.password_protected||'-no-' %>
</span>
</span>
<span id="picture_pass_prot_url">
<% if @picture.password_protected %>
<%= render :partial => 'pic_pass_url' %>
<% end %>
</span>
<%= in_place_editor 'picture_pass_prot',
{:url => url_for (:action => 'update_password_protected',
:id => @picture),
:script => true} %>
the pic_pass_url partial only renders the url for the password protected image.
The update_password_protected action looks something like this
@picture = Picture.find(params[:id])
@picture.password_protected = value
@picture.save
and the update_password_protected.rjs looks like this
page[:picture_pass_prot].replace_html(@picture.password_protected) page[:picture_pass_prot_url].replace_html :partial => 'pic_pass_url'
So we did 2 things now: we replaced 2 elements in the html, and one of them with a partial.
Oh… and to make this work on rails 2.0.x you actually have to patch the in_place_editor def in in_place_macros_helper.rb, adding the line
js_options['clickToEditText'] = %('#{options[:click_to_edit_text]}') if options[:click_to_edit_text]
#ADD THIS LINE HERE
js_options['htmlResponse'] = !options[:script] if options[:script]
function << (', ' + options_for_javascript(js_options)) unless js_options.empty?
because “rails’ “in_place_editor” doesn’t let you specify htmlResponse for the underlying Ajax.InPlaceEditor call, which needs to be set to false.” – see here for the details.
Ok… now finally we have our in_place_editor that updates two (or more) html elements using rjs.
Hey, nice post. I just thought I’d mention the fact that I’ve tackled some of the shortcomings of the “official” in-place-editor (trouble with nested routes for one thing) as well.
It’s mostly Javascript based, but I also have a view helper that makes it pretty trivial.
Here’s the GitHub wiki page: http://github.com/nakajima/nakatype/wikis/better-edit-in-place-editable-js
Cheers
-Pat
Thanks for the feedback! I’ll have a look at it next time I do something with the in_place_editor.
Thanks really a nice post.
And it saved my day :D
Buy Viagra online honestly is a good way to be a good editor
Buy Viagra
great work, i can assume you are an expert on this subject. Well with your permission allow me to grab your rss feed to keep up to date with forthcoming post. Thanks a million and please keep up the gratifying work.
It’s so great to get a break from going shopping for cocktail dresses, and study wonderful articles like this one