在 Rails 中使用 ajax/will_paginate 获取 500 内部服务器错误答案

【问题标题】：Getting 500 internal server error with ajax/will_paginate in Rails在 Rails 中使用 ajax/will_paginate 获取 500 内部服务器错误
【发布时间】：2016-09-22 17:22:58
【问题描述】：

我已经构建了一个卡片滑块，每个页面上加载了 20 张卡片。我正在尝试使用它，以便当用户单击最后一张卡片（索引为 19 的卡片）上的按钮时，会进行 AJAX 调用以呈现下一页并将我原来的 20 张卡片替换为接下来的 20 张卡片。我'正在使用 will_paginate gem，我可以为下一页提取正确的href（即http://localhost:3000/events/queued?page=2）。但是当我向它发出 get 请求时，控制台显示错误“加载资源失败：服务器响应状态为 500（内部服务器错误）”。我在浏览器中手动输入了该网址，该链接工作正常。我尝试在 will_paginate 和 ajax 上遵循 RailsCast 并对其进行修改以满足我的需要，但我很确定我在此过程中搞砸了一些事情。提前感谢您的帮助！

index.html.erb

<% if @events %>

  <div id="event_carousel" class="col-sm-10 col-sm-offset-1 owl-carousel">
    <% @events.each do |event| %>
      <%= render 'event', event: event %>
    <% end %>
  </div>

  <!-- this is set to display none -->
  <div class="text-center"> 
    <h3><%= will_paginate @events %></h3>
  </div>

<% end %>

event.js

var cardCounter = 0;
  var cardOwlIndex = 0;
  var linksArr = [];
  $.ajaxSetup({'cache': true
  });
$(function(){
  var owl = $("#event_carousel");

  links = $('.pagination > a');
  for (var i = 0; i < links.length - 1; i++) {
    linksArr.push(links[i].href);
  };

    $('.btn-square.like').off().on('click', function() {
      $(this).toggleClass('btn-pressed-square-like');
      owl.trigger('owl.next');
      var owlIndex = $(this).closest('.owl-item').index();
      alert(owlIndex);
      cardCounter = owlIndex;
      cardOwlIndex = owlIndex;
      console.log(cardCounter);

      if (cardCounter === 19 && cardOwlIndex === 19) {
        alert(linksArr[0]);
        $.get(linksArr[0], null, null, "script");
      };
    });
});

index.js.erb

$('#event_carousel').html("<%= escape_javascript(render partial: 'event') %>");

events_controller.rb

  def index
     @events = Event.with_rankings(current_user.id, Date.today, 1.month.from_now)
                      .order("event_rankings.weighted_score DESC")
                      .paginate(:page => params[:page], :per_page => 20)
      respond_to do |format|
        format.js
      end
  end

编辑：

错误日志：

ActionView::Template::Error (undefined local variable or method `event' for #<#<Class:0x007fcbd06fd850>:0x007fcbd553d740>):
    1: <div class="col-sm-12">
    2:   <div class="col-sm-12 event-card flip" style="background-image: url(<%= event.image.url(:large) %>);" id="<%= event.id%>">
    3:     <div class="card">
    4:       <div class="card-face front">
    5:       <% if current_user && current_user.admin %>
  app/views/events/_event.html.erb:2:in `_app_views_events__event_html_erb__2820478606869763483_70256714846000'
  app/views/events/index.js.erb:1:in `_app_views_events_index_js_erb___681525537736992419_70256717102340'
  app/controllers/events_controller.rb:55:in `queued'

DevTools 显示它在这一行中断：

xhr.send( ( options.hasContent && options.data ) || null );

【问题讨论】：

你能把你的日志文件贴在这里吗？
看起来您在 index.js.erb 中渲染 event 部分并且没有传递任何局部变量。其次，您需要将所有 index.html.erb 移动到单独的部分中，并在 index.js.erb 和 index.html.erb 中呈现该部分
index.html.erb 中的所有内容？还是只是if @events.... end 中的代码？

标签： javascript jquery ruby-on-rails ajax will-paginate

【解决方案1】：

由于您想用新的页面结果替换所有当前记录，因此您需要用新的页面内容替换现有的页面内容，就像index.html.erb

以下是执行此操作的步骤。

1.为您的events 创建一个公共部分。 _events.html.erb

<% if @events %>    
  <div id="event_carousel" class="col-sm-10 col-sm-offset-1 owl-carousel">
    <% @events.each do |event| %>
      <%= render 'event', event: event %>
    <% end %>
  </div>

  <!-- this is set to display none -->
  <div class="text-center"> 
    <h3><%= will_paginate @events %></h3>
  </div>

<% end %>

2.现在在你的index.html.erb

<div id="events_container">
<%=render partial: 'events'%>
</div>

3.现在为您的ajax 请求添加以下行index.js.erb

$('#events_container').html("<%= escape_javascript(render partial: 'events') %>");

【讨论】：