提交后加载屏幕

Question

我正在做一个RoR页面，在表单之后，下一个页面需要大量的加载，所以我希望在提交和下一个页面之间有一个加载页面

<%= form_tag(next_path, :id => 'myform') do %>
    <%= label_tag "My data" %>
    <%= text_field "name", "", placeholder: "Your name" %>
    <%= submit_tag 'Next' %>
<% end %>

提交

Loading... //Here display the loading screen

显示下一页之后的很多时间

"Hello to the next page User"

编辑

加载屏幕应该在起始页中，因为下一页执行大量的sql查询，并且在完成之前不会使用javascript函数。

欢迎从rails到jquery的解决方案。

Answer 1

这很容易。将隐藏的“加载”消息添加到布局中(或仅添加提交以减缓加载页面的表单)

<div id="slow_warning" style="display:none">
  Loading...
</div>

定义一个显示加载消息的JavaScript函数

function show_slow_warning() {
  $("#slow_warning").show();
}

然后，无论何时触发对慢页的导航，都要调用该函数。您可以使用链接的onclick处理程序或表单的onsubmit处理程序来完成此操作。如果您想变得非常棘手(并且是干净的)，您可以不引人注目地分配处理程序。

$(document).ready(function() {
  $('a.link_to_slow_page').click(function(){
    show_slow_warning();
  });
});