Ajaxified Star Rating System未正确更新

时间:2013-12-30 05:32:46

标签: javascript ruby-on-rails ruby ajax rating-system

我使用本教程实施了星级评分系统 http://eighty-b.tumblr.com/post/1569674815/creating-an-ajaxified-star-rating-system-in-rails-3

Ajax完美运行,直到我添加提交表单的Javascript /在给定用户进行更改后保存数据。

出于某种原因,它将遍历我的索引页面上的所有元素,并在所选对象上提交正确的整数值,但随后在其余部分上提交一堆NIL值。我只想让它更新那个ONE对象。

如何在Javascript中提交相应的图书ID?

新的铁路请帮助:)

视图

index.hrml.erb(books)

  <% @books.each do |book| %>
    <table id="book<%= book.id %>">
      <tbody>  
        <tr>  
          <td>
            <b><%= book.title %></b>
          </td> 
        </tr> 
        <tr>
          <td>  
            <%= book.release %>
          </td>
        </tr>
        <tr>

          <td  id="rating">     #####This is my partial for my form                 
            <%= render :partial => 'ratings/rating', :locals =>{:book => book} %>
          </td>

        </tr>
      <tbody>
    </table>
  <% end %>

_rating.html.erb

  Avg. Rating <%= book.average_rating %>

<%= form_for rating_ballot, :html => { :class => 'rating_ballot' }, :remote => true do |f| %>
<%= render 'shared/error_messages', object: f.object %>

   <%= f.label("value_1", content_tag(:span, '1'), {:class=>"rating", :id=>"1"}) %>
   <%= radio_button_tag("rating[value]", 1, current_user_rating == 1, :class => 'rating_button') %>

   <%= f.label("value_2", content_tag(:span, '2'), {:class=>"rating", :id=>"2"}) %>
   <%= radio_button_tag("rating[value]", 2, current_user_rating == 2, :class => 'rating_button') %>

   <%= f.label("value_3", content_tag(:span, '3'), {:class=>"rating", :id=>"3"}) %>
   <%= radio_button_tag("rating[value]", 3, current_user_rating == 3, :class => 'rating_button') %>

   <%= f.label("value_4", content_tag(:span, '4'), {:class=>"rating", :id=>"4"}) %>
   <%= radio_button_tag("rating[value]", 4, current_user_rating == 4, :class => 'rating_button') %>

   <%= f.label("value_5", content_tag(:span, '5'), {:class=>"rating", :id=>"5"}) %>
   <%= radio_button_tag("rating[value]", 5, current_user_rating == 5, :class => 'rating_button') %>

   <%= hidden_field_tag("book_id", book.id) %>
   <%= f.submit "Submit", class: "btn btn-primary"%>

<% end %>

create.js.erb&amp; update.js.erb

$('table#book<%= @book.id%> td#rating').html("<%= escape_javascript(render :partial => 'ratings/rating', :locals => {:book => @book}) %>");

JAVASCRIPT

rating_ballot.js

####This Submits the Radio Button, but Loops through every Book on the page. 

$(document).ready(function() {

    ###Submits the form (saves data) after user makes a change.

    $('.rating_ballot').change(function() {
    $('.rating_ballot').submit();
  });
});

CONTROLLER

class RatingsController < ApplicationController
  before_filter :current_user, only: [:create, :update]

  respond_to :html, :js

  def create
    @book = Book.find_by_id(params[:book_id])
    @rating = Rating.create(params[:rating])    
    @rating.book_id = @book.id
    @rating.user_id = current_user.id
    if @rating.save
      respond_to do |format|
        format.js
        format.html { redirect_to :back }
      end
    end
  end

  def update
    @book = Book.find_by_id(params[:book_id])
    @rating = current_user.ratings.find_by_book_id(@book_id)
    if @rating.update_attributes(params[:rating])
      respond_to do |format|
        format.js
        format.html { redirect_to :back }
      end
    end
  end

end

1 个答案:

答案 0 :(得分:1)

这是bcoz所有评级表都会在任何单一评级发生变化时提交 按如下所示更改JS代码

$(document).ready(function() {
  $('.rating_button').change(function() {
    $(this).parents('form:first').submit();
  });
});

上面的代码也不适用于JS加载的内容。 即,您添加评级后将不会提交您的评级表,并且该表格已从create.js.erb或update.js.erb更新

将其更改为

$(document).ready(function() {
  $(document).on('change', '.rating_button', function(){
    $(this).parents('form:first').submit();
  });
});