005. Yellow fade effect with JQuery - cwy007/tips-and-skills GitHub Wiki
gem 'jquery-rails'
gem 'jquery-rails-ui'
// app/assets/javascripts/application.js
//= require jquery
//= require jquery-ui
# app/assets/stylesheets/application.scss
@import "jquery-ui";
# pass @current_item to view
def create
@cart = current_cart
product = Product.find(params[:product_id])
@line_item = @cart.add_product(product.id)
respond_to do |format|
if @line_item.save
session[:counter] = 0
format.html { redirect_to store_url }
# update this line from format.js { @current_item = @line_item }
# to format.js { @current_item = @line_item }
format.js { @current_item = @line_item }
format.json { render :show, status: :created, location: @line_item }
else
format.html { render :new }
format.json { render json: @line_item.errors, status: :unprocessable_entity }
end
end
end
<!-- add id to select current_item -->
<% if line_item == @current_item %>
<tr id="current_item">
<% else %>
<tr>
<% end %>
<td class="item_image"><%= image_tag line_item.product.image_url %></td>
<td><%= line_item.quantity %>×</td>
<td><%= line_item.product.title %></td>
<td class="item_price"><%= number_to_currency(line_item.total_price, unit: '¥') %></td>
<td><%= link_to 'delete', line_item_path(line_item), method: :delete, remote: true %></td>
</tr>
$('#cart').html("<%=j render @cart %>")
// add this line
$('#current_item').effect("highlight", {color: '#DFF2BF'}, 1500);
https://stackoverflow.com/questions/848797/yellow-fade-effect-with-jquery
source: book << agile web develop with rails 4 >>