Rails 5在提交表单后在页面加载时执行javascript

时间:2016-04-15 22:57:53

标签: javascript ruby-on-rails ruby

这应该是一个常见的答案,但我已经搜索过,找不到它。我创建了一个<div class"xyz" style= "display:none",其中包含部分内容。我提交的表单是我视图控制器索引的get请求。我在表单提交上运行javascript没有问题,但我想在页面重新加载后执行一些javascript,所以我可以取消隐藏我的div。请记住,这不是一个远程的ajax表单。

index.html.erb:这是隐藏的div,我希望在页面重新加载后取消隐藏:

<div class="six wide column" >
  <div id="clients_piece_tab_container" style="display: none;">
    <%= render :partial => 'client_piece_tab'%>
  </div>
</div>

index.html.erb我的表单使用form_tag

提交索引
<%= form_tag('clients', action: :index, method: :get) do%>
  <%= render :partial => 'update_available'%> # <--Not the div/partial Im trying to unhide.
  <br/>
    <div class="four wide column"> <%=submit_tag "Get Clients", class: "ui primary button"%></div>
<%end%>

我想我知道的是,我应该能够在get请求完成后触发index.js.coffee。但是我尝试了以下错误,其中包含0个参数1:

clients_controller.rb

respond_to do |format|
  format.js {}
end

1 个答案:

答案 0 :(得分:0)

在Rails中,只需正常回答视图。

在该视图中将此放在某处:

<script>
    // rails should fill in form_submitted to true or false...
    var form_was_submitted = <% form_submitted %>;
    // idiomatic jquery for running on page load
    $(function () {
        if (form_was_submitted) {
            console.log ('this runs on page load');
        }
    });
</script>

如果你想没有jquery那么see this SO answer

另一种方法可能是使用AJAX:

<script>
    $('#clients').on ('submit', function (event) {
        // this runs when the user submits the form

        // prevents the form from actually reloading the page
        event.preventDefault ();

        // ajax requests are async
        $.ajax ({
            url: '/path/to/index',
            method: 'GET',
            data: { something: 'something' }
        }).success (function (server_response) {
            // this function runs after the ajax request completes
            console.log ('server responded with ', server_response);
            // show the div
            $('#clients_piece_tab_container').show ();
        });
    });
</script>