Rails - turbolinks问题

Question

我试着在redirect_to update_path之后启用jquery，我试过把turbolinks全部禁用，但都没有用。我目前正在做一个成功更新的window.location.reload()函数，但它是一个可怕的丑陋的工作。有没有更好的方法来实现这一点？

这是用.js编写的

    $.ajax ({
         type: 'POST',
         url: "http://localhost:3000/chess/" + sv + "/" + val,
         success: function(d){
            count = 0;
            window.location.reload();
         }

       });

这是在controller.rb中：

def move
  piece = params[:piece].chomp(",").each_char.map(&:to_i)
  a = piece[0]
  b = piece[2]

  square = params[:square].chomp(",").each_char.map(&:to_i)
  c= square[0]
  d= square[2]

  pieceVal = @@arr[a][b]
  squareVal = @@arr[c][d]

  @@arr = @@arr.each_with_index.map do | e1, i1|
    @@arr[i1].each_with_index.map do |e2, i2|
       if (i1 === a && i2 ===b)
         @@arr[a][b]  = [0]
       elsif (i1 === c && i2 === d)
        @@arr[c][d] = pieceVal
       else
        e2 = @@arr[i1][i2] 
       end
    end
  end

  redirect_to update_path



end

我尝试在重定向后设置turbolinks: false，但这完全禁用了jquery。

Answer 1

对于这本书，我很抱歉:我想我应该解释一下发生了什么，而不仅仅是给你一个答案。

问题

所以turbolinks在这里不是问题。问题出在你的实现中(这并不是什么大问题)

当您编写redirect_to ...时，它会告诉您的浏览器转到响应头中指定的Location。它不返回正文(就像GET请求返回HTML正文一样)

实现

这里的技巧是实现某种方式，用新的棋盘替换棋盘的内容，而不需要重新加载整个页面。因为我们已经知道了新棋盘的输出，所以我们可以用javascript来做这件事。

HTTP请求示例

HTTP请求(可以认为它们是控制器方法的结果)可以响应许多不同的格式。您已经熟悉了HTML响应，这些都是标准的。还有其他格式，包括(但不限于) XHR请求(代表XML HTTP请求)和JSON请求。

Similarly to my response to a question you asked yesterday，您可以通过在application_controller.rb中添加以下代码来查看差异(假设您也添加了其他代码)：

def test
  respond_to do |format|
    format.html { render :text => "I love me some #{params[:cookies]} with my #{params[:cream]}" } 
    format.json { render :json => { :result => "I love me some #{params[:cookies]} with my #{params[:cream]}", :cookie_result => params[:cookies], :what_kind_of_cream_did_he_want => params[:cream] } 
    format.js { render :text => "alert('I love me some #{params[:cookies]} with my #{params[:cream]}');" } 
  end
end

然后在浏览器中输入localhost:3000/chocolate-chip/and/milk.json来查看生成的JSON。

注意: Rails期望XHR请求(大多数时候是对ajax请求的响应)的format为js，不要让它给您带来麻烦。

我们不能调用localhost:3000/chocolate-chip/and/milk.xhr，因为我们没有MIME类型；浏览器不知道如何处理它，我们的Rails服务器(如puma或webrick)也不知道如何处理它。这很好，也很正常。

XHR请求是客户端的东西(就HTML/JS而言)。它们可以比作您发送POST请求的方式:您指示浏览器做一些事情。

我们要做的是告诉浏览器发送一个ajax请求。值得庆幸的是，如果您正在使用jquery_ujs (您可能正在使用application.js，只需查看您的Rails文件)，Rails可以让这一切变得简单

要查看从上面的示例生成的XHR响应，请将<%= link_to "What kind of cookies", "/chocolate-chip/and/milk", :remote => true %>放在现有*.html.erb文件中您可以查看的某个位置。继续并单击它。它应该返回一个警示框，表明我们对巧克力薯片和牛奶的喜爱。

如你所见，我们的内联javascript被执行了。

解决方案

所以现在的问题是“我怎么才能把我的棋盘换成这个呢？”

最好的做法是使用_board.html.erb的partial来呈现板子。如果它与控制器期望的视图路径相同，则为<div id="chess_board_wrapper"><%= render 'board' %></div> (每个Rails约定，您应该遵循它们)。注意:在呈现的国际象棋棋盘的父元素中有一个ID属性在这里很重要；我们稍后会用到它。

在_board.html.erb中，只需复制粘贴现有的棋盘标记即可。

现在，创建一个move.js.erb (是的，.js.erb)，就像创建new.html.erb一样。在move.js.erb文件中，您可以简单地编写$('#chess_board_wrapper').html('<%=j render "board" %>');

然后，告诉您的move方法响应XHR请求，

def move
  # ...
  respond_to do |format|
    format.js # should automatically read move.js.erb 
    format.html { redirect_to update_path } 
  end
end

剩下的就是历史了。我确信您也可以从ajax调用中删除success函数。