Ajax化的星级评定系统是不正确更新 [英] Ajaxified Star Rating System is not Updating Correctly
问题描述
我使用本教程 <一个实施的星级评定系统href="http://eighty-b.tumblr.com/post/1569674815/creating-an-ajaxified-star-rating-system-in-rails-3" rel="nofollow">http://eighty-b.tumblr.com/post/1569674815/creating-an-ajaxified-star-rating-system-in-rails-3
阿贾克斯完美的作品，直到我补充一点，提交表单的使用Javascript /保存一个给定用户后的数据进行更改。
由于某些原因，它会通过我的索引页的所有元素，并提交选定的对象上正确的整数值，但随后循环提交了一堆NIL值就休息。我只希望它更新一个对象。
（如何提交相应的图书编号的Javascript的？）
新建轨道请帮助：）
VIEWS
index.hrml.erb（书籍）
＆LT;％@ books.each办|预订| ％＆GT;
＆LT;表ID =书＆LT;％= book.id％＆GT;＆GT;
＆LT; TBODY＆GT;
＆其中; TR＆GT;
＆LT; TD＆GT;
＆LT; B＆GT;＆LT;％= book.title％＆GT;＆LT; / B＆GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆其中; TR＆GT;
＆LT; TD＆GT;
＆其中;％= book.release％GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆其中; TR＆GT;
＆LT; TD ID =评级＆GT; #####这是我的部分我的表格
＆LT;％=渲染：部分=＆GT; 评级/评价'，：当地人=＆GT; {：书=＆GT;本书}％GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; TBODY＆GT;
＆LT; /表＆gt;
＆LT;％结束％GT;
_rating.html.erb
平均。评分：LT;％= book.average_rating％＆GT;
＆LT;％=的form_for rating_ballot，：HTML =＆GT; {：类=＆GT; rating_ballot'}：远程=＆GT;真做| F | ％＆GT;
＆LT;％=渲染'共享/ error_messages'，对象：f.object％＆GT;
＆LT;％= f.label（_1，content_tag（：跨度，'1'），{：类=＆gt;中等级，：ID =＆gt;中1}）％＆GT;
＆LT;％= radio_button_tag（评级[值]，1，current_user_rating == 1：类=＆GT;'rating_button）％＆GT;
＆LT;％= f.label（_2，content_tag（：跨度，'2'）{：类=＆gt;中等级，：ID =＆gt;中2}）％＆GT;
＆LT;％= radio_button_tag（评级[值]，2，current_user_rating == 2：类=＆GT;'rating_button）％＆GT;
＆其中;％= f.label（VALUE_3，content_tag（：跨度，'3'），{：类=＆gt;中的评价，：ID =＆gt;中3}）％＆GT;
＆LT;％= radio_button_tag（评级[值]，3，current_user_rating == 3：类=＆GT;'rating_button）％＆GT;
＆LT;％= f.label（value_4，content_tag（：跨度，'4'）{：类=＆gt;中等级，：ID =＆GT;4}）％＆GT;
＆LT;％= radio_button_tag（评级[值]，4，current_user_rating == 4：类=＆GT;'rating_button）％＆GT;
＆其中;％= f.label（value_5，content_tag（：跨度，'5'），{：类=＆gt;中的评价，：ID =＆gt;中5}）％＆GT;
＆LT;％= radio_button_tag（评级[值]，5，current_user_rating == 5：类=＆GT;'rating_button）％＆GT;
＆其中;％= hidden_field_tag（book_id，book.id）％＆GT;
＆LT;％= f.submit提交，类：BTN BTN-主要％＆GT;
＆LT;％结束％GT;
create.js.erb和放大器; update.js.erb
$（'表＃书＆LT;％= @ book.id％＆GT; TD＃等级）HTML（＆LT;％= escape_javascript（渲染：部分=＆GT;评级/评价'，：当地人=＆GT; {：书=＆GT; @book}）％＆gt;中）;
JAVASCRIPT
rating_ballot.js
####此提交单选按钮，但页面上的遍历每本书。
$（文件）。就绪（函数（）{
###提交表单（保存数据）后用户进行了更改。
$（'。rating_ballot'）。改变（函数（）{
$（'。rating_ballot）提交（）。
}）;
}）;
控制器
类RatingsController＆LT;的ApplicationController
的before_filter：CURRENT_USER，只有：[：创建：更新]
respond_to代码：HTML，：JS
DEF创建
@book = Book.find_by_id（PARAMS [：book_id]）
信用排名= Rating.create（PARAMS [：等级]）
@ rating.book_id = @ book.id
@ rating.user_id = current_user.id
如果@ rating.save
respond_to代码做|格式|
format.js
的format.html {redirect_to时：回}
结束
结束
结束
DEF更新
@book = Book.find_by_id（PARAMS [：book_id]）
信用排名= current_user.ratings.find_by_book_id（@book_id）
如果@ rating.update_attributes（PARAMS [：等级]）
respond_to代码做|格式|
format.js
的format.html {redirect_to时：回}
结束
结束
结束
结束
这是bcoz所有等级形式提交，只要任何一个等级改变 改变你的JS code如下：
$（文件）。就绪（函数（）{
$（'。rating_button'）。改变（函数（）{
$（本）。家长（形式：一是）提交（）;
}）;
}）;
也高于code不会在JS加载的内容合作。 即你的评级表将不会被提交，一旦你添加评级，这种形式是从create.js.erb或update.js.erb
更新将其更改为
$（文件）。就绪（函数（）{
$（文件）。在（'变'，'.rating_button'，函数（）{
$（本）。家长（形式：一是）提交（）;
}）;
}）;
I've implemented a Star Rating System using this tutorial http://eighty-b.tumblr.com/post/1569674815/creating-an-ajaxified-star-rating-system-in-rails-3
The Ajax works perfectly, until I add the Javascript that Submits the form/saves the data after a given user makes a change.
For some reason, it will loop through all the elements on my Index Page, and Submits the correct integer value on the selected object, but then submits a bunch of NIL values on the rest. I only want it to update that ONE object.
(How can I submit the appropriate Book ID in the Javascript?)
New to rails please help :)
VIEWS
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 & 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
This is bcoz all the rating forms are submitted whenever any single rating is changed Change your JS code as follows
$(document).ready(function() {
$('.rating_button').change(function() {
$(this).parents('form:first').submit();
});
});
Also above code will not work in JS loaded content. i.e. your rating form will not be submitted once you add rating and that form is updated from create.js.erb or update.js.erb
Change it to
$(document).ready(function() {
$(document).on('change', '.rating_button', function(){
$(this).parents('form:first').submit();
});
});
这篇关于Ajax化的星级评定系统是不正确更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
