2

在我的 Rails 5 / Turbolinks 5 应用程序中,我想将表单提交产生的​​ html 放入 div 中。

表格是一个

= form_for(user) do |f|

标准导轨形式。

成功提交后,将重定向发送到浏览器

respond_to do |format|
      if @user.save
        format.html { redirect_to @user, notice: 'User was  created.' }

当我通过 ajax 提交表单时:

$(".dialog").on("submit", "form", function(e){
 e.preventDefault();
 $.ajax({
  url: $(this).attr("action"),
  method: "POST",
  data: $(this).serialize()
 }).done(function(data) {
  $(".dialog .canvas").html(data);
 });
});

from 被提交,服务器的 redirect_to 语句将浏览器重定向到新用户的页面。

重定向会导致 turbolinks 将正文替换为浏览器重定向到的页面内容。相反,我想替换特定的 div $(".dialog .canvas").html(data)。我怎样才能防止 turbolinks 的这种行为。

4

2 回答 2

1

如果我理解您正在尝试正确执行的操作,您可以从服务器呈现 HTML 并div使用从服务器生成的 JavaScript 更新您的元素。

# HTML form
<%= form_for @user, remote: true do |f| %>
  ...
<% end %>

# app/controllers/users_controller.rb
def create
  @user = User.create(user_params)
  # renders create.js.erb automatically with AJAX request (remote: true)
end

# app/views/users/create.js.erb
$("#my-div").html("<%=j render(partial: 'users/user', locals: { user: @user }) %>");

请注意,在您的js.erb文件中,您可以使用 Ruby 和 JavaScript;我发现它对于构建 HTML 和动态内容并将其传递回客户端以作为 JavaScript 运行非常有用。

人们可以讨论服务器生成的 JavaScript 的优缺点,但我认为它非常好并且运行良好。否则你必须保持服务器/客户端模板同步,这真的很麻烦;或者您必须在客户端执行所有模板,并且仅将服务器用于 JSON。

我只是不认为将来会以这种方式分解客户端/服务器,尽管有很多人声称这是一切的发展方向。看看大量涌现的 JavaScript MVC 框架。

于 2017-03-11T00:17:04.790 回答
0

使用 turbolinks 5.0.1,在控制器中添加选项,turbolinks: false format.html { redirect_to @user, notice: 'User was created.', turbolinks: false }

其他解决方案(不太好,因为它不允许您更新到 Rails 5.1)是坚持使用 turbolinks 2.5.3。

使用 format.js 甚至 format.json 可能还有其他解决方案,检查:https ://github.com/vtamara/turbolinks_prob50

于 2017-07-11T19:54:32.123 回答