In-place editing with Twitter Bootstrap for Rails 3/4
This gem is based on X-editable (v1.5.1) which is the new version of Bootstrap Editable.
https://github.com/vitalets/x-editable
See http://vitalets.github.com/x-editable
Add this line to your application's Gemfile:
gem 'bootstrap-editable-rails' And then execute:
$ bundle Write the top of app/assets/javascripts/application.js like this:
//= require jquery//= require jquery_ujs//= require bootstrap//= require bootstrap-editable//= require bootstrap-editable-rails//= require_tree .and need to load bootstrap-editable.css at the place where you like.
Follow the documents of X-editable above.
Additional required attribute is resource.
<ahref="#" id="username" data-type="text" data-resource="post" data-name="username" data-url="/posts/1" data-original-title="Enter username">superuser</a>then, sends PUT /posts/1 request with the body:
post[username]=superuser When using textarea type, textarea_format helper method for formatting line breaks is available.
<ahref="#" id="body" data-type="textarea" data-resource="post" data-name="body" data-url="/posts/1" data-original-title="Enter body"><%= textarea_format(@post.body) %></a>PostsController receives the parameters
{"id" => "1", "post" =>{"username" => "superuser" } } and must respond with 2xx (means success) status code if successful.
For example, scaffold works well by 204 because default dataType is json.
defupdate@post=Post.find(params[:id])respond_todo |format| if@post.update_attributes(params[:post])format.html{redirect_to@post,notice: 'Post was successfully updated.'}format.json{head:no_content}# 204 No Contentelseformat.html{renderaction: "edit"}format.json{renderjson: @post.errors,status: :unprocessable_entity}endendendThe scaffold above will not work with jQuery 1.9.0 (included in jquery-rails 2.2.0) because of jQuery's bug.
If you use the old version of jQuery, please update jquery-rails to avoid it.
- Fork it
- Create your feature branch (
git checkout -b my-new-feature) - Commit your changes (
git commit -am 'Add some feature') - Push to the branch (
git push origin my-new-feature) - Create new Pull Request