Question

我的应用中有一个评分系统，并且<div>元素的平均评分为。当我点击星号时（我在数据库中创建一个新的rating），我需要更新平均评级值。这是我对索引页面的看法，我使用评级：

<h1>List of casinos</h1>

<div class="casinos-list">
  <% @casinos.each do |casino| %>
    <div class="casino-item">
      <p class="casino-name"><%= link_to casino.name, casino %></p>
      <p class="casino-description"><%= casino.description %></p>
      <ul class="rating">
        <% form_id = "casino_#{casino.id}_rating" %>
        <%= form_for casino.ratings.build, html:
            { id: "casino_#{casino.id}_rating", class: 'star_rating_form' } do |f| %>
          <%= f.hidden_field :casino_id %>
          <%= f.hidden_field :score, id: "#{form_id}_stars", class: 'star-value' %>
        <% end %>

      </ul>
      <div id="<%= "average_rating_#{form_id}" %>" class="average-rating" data-rating="<%= casino.id %>"><span><%= casino.average_rating.to_f.round(2) %></span></div>
      <div id="<%= "rate_#{casino.id}" %>" class="rateit" data-rateit-mode="font">
      </div>
    </div>
  <% end %>
</div>

和我的application.js：

$(document).on('turbolinks:load', function () {

  $('.rateit-reset').remove();

  $('.rateit-hover').click(function () {
    var rating = $(this).parents().attr('aria-valuenow');
    var float_number = parseFloat(rating);
    var rating_form_input = $(this).parents().parents('.casino-item').children('.rating').children('.star_rating_form').children('.star-value');
    var form_id = $(this).parents().parents('.casino-item').children('.rating').children('.star_rating_form').attr('id');
    rating_form_input.val(float_number);

    $.ajax({
      type: 'post',
      url: $('#' + form_id).attr('action'),
      data: $('#' + form_id).serialize()
    })
  })

});

我试图做这样的事情：$(this).parents().parents().parents('.casino-item').children('.average-rating').children('span').load(location.href + ' .average-rating');，但它在现有的附近创建了一个新元素。据我了解，我需要再打一次ajax电话。我试着这样做：

function updateRating () {
  var $target = $('.average-rating');
  $.ajax({
      url: '/casinos/',
      dataType: 'json',
      type: 'get',
      success: function(data) {
        $target.html(data['response'])
      }
    }
  );
}

但它给了我所有的赌场。我很困惑，在url电话中ajax应该是怎样的？或者也许我错过了其他的东西？提前谢谢。

使用ajax调用更新div的值

0 个答案: