使用rails 4.2.1应用程序中的javascript实现对搜索栏的显示/隐藏

I would like to wait for javascript hide function until my searches are done so that I could make further searches from thereon.

我想等待javascript隐藏功能,直到我的搜索完成,以便我可以从上面进行进一步的搜索。

Whenever I make a search then if I press enter, all of sudden my search bar is in hidden state.

每当我进行搜索时,如果我按下回车键,突然我的搜索栏处于隐藏状态。

For better visualization and understanding, just follow the screen-shot as below;

为了更好的可视化和理解,只需按照下面的屏幕截图;

index.html.erb

<a href="#" class="toggle-formed" style="float: right;" >Search</a>

                <div id="sample" class="<%= @xvaziris_data.present? ? 'hidden' : '' %>">

                    <%= form_tag xvaziris_path, method: 'get', class: "form-group", role: "search" do %>
                    <p>
                        <center><%= text_field_tag :search, params[:search], placeholder: "Search for.....", class: "form-control-search" %>
                            <%= submit_tag "Search", name: nil, class: "btn btn-md btn-primary" %></center>
                        </p>
                        <% end %><br>

                        <% if @xvaziris.empty? %>

                        <center><p><em>No results found for.</em></p></center>              

                        <% end %>

                    </div>

search.js

$(document).on('page:change', function () {
        $("div#sample").hide();

    //    | === HERE
    $("a.toggle-formed").click(function(event) {
        event.preventDefault();
        $("div#sample").fadeToggle();
    });
});

general.scss

.hidden {
  display: none;
}

Any suggestions are most welcome.

任何建议都是最受欢迎的。

Thank you in advance.

先感谢您。

1 个解决方案

#1

Actually I got it working after implementing the search through Ajax as it is dynamically changing the data without reloading the page and without hiding the search bar until the searches are done and it only hides when the page is refreshed or reloaded. That's it....

实际上,我在通过Ajax实现搜索后得到了它,因为它在不重新加载页面的情况下动态更改数据,并且在搜索完成之前不会隐藏搜索栏,并且只在页面刷新或重新加载时才隐藏。而已....