Jquery nicescroll不适用于rails中的tab

时间:2014-08-28 13:24:02

标签: jquery ruby-on-rails-4 nicescroll

我创建了多名员工,所有员工的详细信息都显示在索引页面上,使用rails中的多个选项卡。下面是助理导演,2)教师,3)助理教师,4)簿记员,5)流动员,每个员工都是显示100条记录。 我正在为我的项目使用jquery nicescroll插件,但是jquery nicescroll没有在tab上工作。所有页面都正常工作。如何解决它?

这是我的index.html.erb

<div id="content-header">
<h1>All Staff</h1>
</div>
<div id="breadcrumb">
<a href="/day_cares/dashboard" title="Go to Home" class="tip-bottom"><i  class="glyphicon glyphicon-home"></i> Home</a>
<a href="/staff" class="current">All Staff</a>
</div>
<div class="container-fluid" id="report">
<div class="row">
<div class="col-12 col-lg-12">
<div class="widget-box">
<div class="widget-title">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#assistant_directors">Assistant Directors</a></li>
<li><a data-toggle="tab" href="#teachers">Teachers</a></li>
<li><a data-toggle="tab" href="#assistant_teachers">Assistant Teachers</a></li>
<li><a data-toggle="tab" href="#bookkeepers">Bookkeepers</a></li>
<li><a data-toggle="tab" href="#floaters">Floaters</a></li>
</ul>
</div>

<div class="widget-content tab-content">
<div class="tab-pane active" id="assistant_directors">
<div class="row">
<%= render 'staff_list', :staff => @assistant_directors %>
</div><!-- /row -->
</div>

<div class="tab-pane" id="teachers">
<div class="row">
<%= render 'staff_list', :staff => @teachers %>
</div><!-- /row -->
</div>

<div class="tab-pane" id="assistant_teachers">
<div class="row">
<%= render 'staff_list', :staff => @assistant_teachers %>
</div><!-- /row -->
</div>

<div class="tab-pane" id="bookkeepers">
<div class="row">
<%= render 'staff_list', :staff => @bookkeepers %>
</div><!-- /row -->
</div>

<div class="tab-pane" id="floaters">
<div class="row">
<%= render 'staff_list', :staff => @floaters %>
</div><!-- /row -->
</div>
</div>
</div><!-- /widget-box -->
</div><!-- /col-12 -->
</div><!-- /row -->
</div><!-- /container-fluid -->

这是我的渲染页面staff_list.html.erb

<div class="widget-content">
<table class="table table-bordered table-striped table-hover data-table">
<thead>
<tr>
<th>Name</th>
<th>Birthday</th>
<th>E-Mail</th>
<th>Hire Date</th>
<th>Credit Hours</th>
<th>In-service Hours</th>
<th>Options</th>
</tr>
</thead>
<tbody>
<% staff.each do |staff| %>
<tr>
<td><%= staff.name.truncate(25) if staff.name %></td>
<td><%= staff.birth_day.strftime('%m/%d/%Y') if staff.birth_day %></td>
<td><%= staff.user.email %></td>
<td><%= staff.hire_date.strftime('%m/%d/%Y') if staff.hire_date %></td>
<td><%= staff.credit_hours %></td>
<td><%= staff.in_service_hours %></td>
<td>
<% if staff.user.has_role? :assistant_director %>
<div class="button_staff_index">
<%= link_to 'Edit', edit_assistant_director_path(staff),:class=>"btn btn-primary" %>
<%= link_to 'View', staff,:class=>"btn btn-success"  %>
<%= link_to 'Delete', staff, method: :delete, data: { confirm: 'Are you sure?' }, :class=>"btn btn-danger"  %></td>
</div>
<% elsif staff.user.has_role? :teacher %>
<div class="button_teacher_index">
<%= link_to 'Edit', edit_teacher_path(staff),:class=>"btn btn-primary" %>
<%= link_to 'View', staff, :class=>"btn btn-success" %>
<%= link_to 'Delete', staff, method: :delete, data: { confirm: 'Are you sure?' }, :class=>"btn btn-danger"  %></td>
</div>
<% elsif staff.user.has_role? :assistant_teacher %>
<div class="button_assistant_teacher_index">
<%= link_to 'Edit', edit_assistant_teacher_path(staff),:class=>"btn btn-primary" %>
<%= link_to 'View', staff,:class=>"btn btn-success" %>
<%= link_to 'Delete', staff, method: :delete, data: { confirm: 'Are you sure?' },:class=>"btn btn-danger" %></td>
</div>
<% elsif staff.user.has_role? :bookkeeper %>
<div class="button_bookkeeper_index">
<%= link_to 'Edit', edit_bookkeeper_path(staff),:class=>"btn btn-primary" %>
<%= link_to 'View', staff,:class=>"btn btn-success" %>
<%= link_to 'Delete', staff, method: :delete, data: { confirm: 'Are you sure?' },:class=>"btn btn-danger" %></td>
</div>
<% elsif staff.user.has_role? :floater %>
<div class="button_floater_index">
<%= link_to 'Edit', edit_floater_path(staff),:class=>"btn btn-primary" %>
<%= link_to 'View', staff,:class=>"btn btn-success" %>
<%= link_to 'Delete', staff, method: :delete, data: { confirm: 'Are you sure?' },:class=>"btn btn-danger" %></td>
</div>
<% end %>
</tr>
<% end %>
</tbody>
</table>
</div><!-- /widget-content nopadding -->

感谢您的帮助!

1 个答案:

答案 0 :(得分:1)

尝试在切换标签时再次删除并绑定它

 $("#MYDIV").getNiceScroll().remove();
        $('#MYDIV').niceScroll({
            background: "#bbb",
            cursorborder: "0",
            cursorwidth: "4px",
            horizrailenabled: false
        });

假设您将此函数放在单击处理程序