dataTables columnFilter无法输入用于列过滤的数据 [英] dataTables columnFilter no way to enter data for column filtering

问题描述

页面显示带有列名称的脚，但没有位置输入列过滤器的值. 我查看了数据表网站上的示例以及堆栈溢出网站上的其他示例，但没有发现如何修复它的线索. 任何帮助或建议如何解决此问题将不胜感激. 谢谢.

The page shows foot with column names but no places to enter the values for column filters. I looked to the examples on the data tables web site and others in the stack overflow website and found no clue how to fix it. Any help or suggestion how to fix this will be much appreciated. Thank you.

<% provide(:title, 'TBMs Daily Progress') %>

<% if signed_in? %>

    <h3>TBMs Max Station by day - Today's date: <%=@current_date%></h3>

  <% if @current_date != @tbms_progress_W.daily_date %>
      <h6 class="error-message">
          <%= "Today's location for TBM W is not loaded" %>
          <%= " Last TBM W recorded date was: " %>
          <%=@tbms_progress_W.daily_date %>
      </h6>
  <% end %>

  <% if @current_date != @tbms_progress_E.daily_date %>
      <h6 class="error-message">
          <%= "Today's location for TBM E is not loaded" %>
          <%= " Last TBM E recorded date was: " %>
          <%=@tbms_progress_E.daily_date %>
      </h6>
  <% end %>

    <p>
        <% if current_user.admin? %>
            <%= link_to "Add new location", new_tbms_progress_path, class: "btn btn-sm btn-danger" %>
        <% end %>
        <%= link_to "List view", tbms_progresses_path, class: "btn btn-sm btn-primary" %>
    </p>

    <table id="progresstable" class="display table-bordered table-condensed table-responsive table-hover">
        <thead style="background-color: #bbbbbb;">
            <tr>
                <th>Daily Date</th>
                <th>TBM ID</th>
                <th>Max Station</th>
                <th>TBM Status</th>
                <th>ID</th>
            </tr>
        </thead>
        <tbody>
            <% @tbms_progresses.each do |tbms_progress| %>
                <tr>
                    <td><%= tbms_progress.daily_date %></td>
                    <td><%= tbms_progress.tbm_id %></td>
                    <td><%= number_with_precision tbms_progress.max_station, precision: 2 %>
                    <td><%= tbms_progress.tbm_status %></td>
                    <td><%= link_to tbms_progress.id, tbms_progress %></td>
                </tr>
            <% end %>
        </tbody>
        <tfoot>
            <tr>
                <th>Daily Date</th>
                <th>TBM ID</th>
                <th>Max Station</th>
                <th>TBM Status</th>
                <th>ID</th>
            </tr>
        </tfoot>
    </table>
    <hr/>
    <h6>Legend: W aka TBM1 or 26900, E aka TBM2 or 27000</h6>

<% else %>
    <%= render 'instruments/unsigned' %>
<% end %>

<script>
  $(document).ready
  (function() 
      {
        $('#progresstable').dataTable
        (
            {
                /*sPaginationType: "full_numbers",*/
                bJQueryUI: true,
                aaSorting: [ [0,"desc"], [1, "desc"] ],
                bDeferRender: true,
                bStateSave: true
            }
        ).columnFilter
        (
            {aoColumns: 
                [
                    { type: "text" },
                    { type: "text" },
                    { type: "text" },
                    { type: "text" },
                    { type: "text" }
                ]
            }
        );
      }
    );
</script>

推荐答案

我通过移动到数据表1.10.2来解决此问题，不再使用表的引导程序布局，而是从//cdn运行数据表的脚本包含表格的每个页面上的.datatables.net.

I solved this by moving to the data tables 1.10.2, not using anymore bootstrap layout for the tables and I running the scripts for data tables from //cdn.datatables.net on each page containing a table.

这篇关于dataTables columnFilter无法输入用于列过滤的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！