0

大家好,我正在使用 Star Rating jQuery Plugin Raty 来做一些评论/评级事情。现在我有一个需要审查的数据列表,然后审查的方法将在一个 boostrap 模态框中。但是,评级星只出现在我列表的第一个表格中,而星号不会出现在表格的其余部分中。只有在第一个表单的审核和提交后,才会显示第二个表单的星标。示例如下图。

这是列表的第一种形式。星星正在显示并能够给出评级。

在此处输入图像描述

然后在列表中的第二个表单之后,星星从表单中消失,只会显示第一个表单是评论并提交。

在此处输入图像描述

以下是最终结果。但目前我能够从顶部开始一一评分,我希望我可以随机评分。

在此处输入图像描述

以下是我在表格和模式框中呈现列表的代码。

<% @appointment.approve_applicants.each_with_index do |applicant, index| %>
<tr>
<td><%= index + 1 %></td>
<td><%= link_to applicant.user.fullname, applicant.user %></td>
<td><%= link_to "Reviews", applicant.build_review, "data-toggle" => "modal", "data-target" => "#detail#{applicant.id}" %></td>
<td></td>

<!--Modal-->
<div class="modal fade" id="detail<%= applicant.id %>" role="dialog">
  <div class="modal-dialog">
    <!--Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close close_book_detail" data-dismiss="modal">&times;</button>
        <%= form_for(Review.new) do |f| %>
          <%= render 'shared/error_messages', object: f.object %>
          Rating for user <%= applicant.user.fullname %>
          <div class="form-group row">
            <%= f.label :rating, class: 'col-sm-2 form-control-label' %>
            <div class="col-sm-6" id='star-rating'>
              <%=hidden_field_tag "review[rating]", '', id: "rating_star" %>
            </div>
          </div>
          <%= f.label :comment %>
          <%= f.text_area :comment, placeholder: "Please enter comment here." %>
          <%= f.submit "Save changes", class: "btn btn-primary" %>
        <% end %>
      </div>
    </div>
  </div>
</div>
</tr>
<% end %>

然后下面是 jQuery 评级星星插件的 javascript。

<script>
$('#star-rating').raty({
    path: '/assets',
    target     : '#rating_star',
    targetType : 'score',
    targetKeep : true
});
</script>

<script>
$('.star-rating-show').raty({
    path: '/assets/',
    readOnly: true,
    score: function() {
        return $(this).attr('data-score');
    }
});
</script>

预先感谢您帮助我!

4

0 回答 0