简体   繁体   English

在Rails中重新加载页面后,某些功能不起作用

[英]Some functions are not working after reloading page in rails

I have a navigation bar and sidebar. 我有一个导航栏和侧边栏。 In the navigation bar, I have a search box, sidebar minimize button, dropdown box for profile, and logout. 在导航栏中,我有一个搜索框,侧边栏最小化按钮,配置文件的下拉框和注销。

In the side bar I have home, about, orders,and contact us. 在边栏中,我有家,关于,订购和与我们联系。

My rot page is home. 我的烂页在家里。 Upon loading the root page, some images are not displaying. 加载根页面后,某些图像未显示。 It displays after clicking the home link in the side bar. 单击侧栏中的主页链接后,它将显示。 The same thing happens for the drop down list, and is also not working after reloading the page. 下拉列表也会发生同样的事情,并且在重新加载页面后也无法正常工作。 I am also using jquery plugins. 我也在使用jquery插件。

//= require jquery  
//= require jquery_ujs  
//= require turbolinks  
//= require_tree .

Please help me with what code I need to add to solve my problem. 请帮助我解决我需要添加的代码。 I am new to rails, thanks. 我是新手,谢谢。
Update 更新资料

<div class="table-responsive">
                            <table class="table table-actions-bar m-b-0">
                                <thead>
                                    <tr>
                                        <th></th>
                                        <th>product Name</th>
                                        <th>product status</th>
                                        <th style="min-width: 80px;">Manage</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <% i =0 %>
                                    <% @products.each do |products| %>
                                    <% if i == 0 %>
                                    <tr>
                                        <td><span data-plugin="peity-bar" data-colors="#5fbeaa,#5fbeaa" data-width="80" data-height="30">5,3,9,6,5,9,7,3,5,2</span></td>
                                        <td><img src="assets/products/iphone.jpg" class="thumb-sm pull-left m-r-10" alt=""> <%= product['productname'] %> </td>
                                        <% if product['status'] != "buy" %>
                                        <td><span class="text-custom"><%= product['status'] %></span></td>
                                        <% else %>
                                        <td><span class="text-danger"><%= produt['status'] %></span></td>
                                        <% end %>
                                        <td>
                                          <a href="#" class="table-action-btn"><i class="md md-edit"></i></a>
                                          <a href="#" class="table-action-btn"><i class="md md-close"></i></a>
                                      </td>
                                  </tr>  

this is for graph according to data.. 这是根据数据的图表。

This is most likely happening because you haven't wrapped your js scripts in a $(document).ready call. 这很可能发生,因为您尚未将js脚本包装在$(document).ready调用中。 You can add turbolinks back to your application.js file and then wrap all of your js scripts in a page:load call as follows: 您可以将turbolinks添加回application.js文件,然后将所有js脚本包装在page:load调用中,如下所示:

var ready;
ready = function() {

  ...your javascript goes here...

};

$(document).ready(ready);
$(document).on('page:load', ready);

The page:load will fire when only part of your app is fetched due to turbolinks. 当由于涡轮链接仅获取部分应用程序时,将触发page:load。

If you have RAILS 5 you can do: 如果您有RAILS 5 ,则可以执行以下操作:

$(document).on('turbolinks:load', function() {

  ...your javascript goes here...

});

Have you tried using the jquery.turbolinks gem first? 您是否尝试过首先使用jquery.turbolinks gem?

jQuery-turbolinks jQuery-涡轮链接

It's tailored to Turbolinks 3 or lower, but you can download the Turbolinks 5 shim and put that in your if you've already made the jump to 5. 它是为Turbolinks 3或更低版本量身定制的,但是如果您已经跳转到5,则可以下载Turb​​olinks 5填充程序并将其放入您的文件中。

Turbolinks compatibility shim Turbolinks兼容垫片

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM