如何使用 Footable 行切换器来切换数据答案

【问题标题】：how to use Footable row-toggler for toggling the data如何使用 Footable 行切换器来切换数据
【发布时间】：2016-09-27 17:58:53
【问题描述】：

伙计们，我对此很陌生，请帮帮我。我正在使用footable来切换数据。但我真的不知道为什么它不起作用。很好地尝试了他们文档中给出的代码，但仍然没有解决了。帮帮我。这就是我现在的样子-

<table class="table" data-toggle-column="last">
    <thead>
        <tr>
            <th data-breakpoints="xs">ID</th>
            <th>First Name</th>
            <th>Last Name</th>
            <th data-breakpoints="xs">Job Title</th>
            <th data-breakpoints="xs sm">Started On</th>
            <th data-breakpoints="all" data-title="DOB">Date of Birth</th>
        </tr>
    </thead>
    <tbody>
        <tr data-expanded="true">
            <td>1</td>
            <td>Dennise</td>
            <td>Fuhrman</td>
            <td>High School History Teacher</td>
            <td>November 8th 2011</td>
            <td>July 25th 1960</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Elodia</td>
            <td>Weisz</td>
            <td>Wallpaperer Helper</td>
            <td>October 15th 2010</td>
            <td>March 30th 1982</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Raeann</td>
            <td>Haner</td>
            <td>Internal Medicine Nurse Practitioner</td>
            <td>November 28th 2013</td>
            <td>February 26th 1966</td>
        </tr>
        <tr>
            <td>4</td>
            <td>Junie</td>
            <td>Landa</td>
            <td>Offbearer</td>
            <td>October 31st 2010</td>
            <td>March 29th 1966</td>
        </tr>
        <tr>
            <td>5</td>
            <td>Solomon</td>
            <td>Bittinger</td>
            <td>Roller Skater</td>
            <td>December 29th 2011</td>
            <td>September 22nd 1964</td>
        </tr>
        <tr>
            <td>6</td>
            <td>Bar</td>
            <td>Lewis</td>
            <td>Clown</td>
            <td>November 12th 2012</td>
            <td>August 4th 1991</td>
        </tr>
        <tr>
            <td>7</td>
            <td>Usha</td>
            <td>Leak</td>
            <td>Ships Electronic Warfare Officer</td>
            <td>August 14th 2012</td>
            <td>November 20th 1979</td>
        </tr>
        <tr>
            <td>8</td>
            <td>Lorriane</td>
            <td>Cooke</td>
            <td>Technical Services Librarian</td>
            <td>September 21st 2010</td>
            <td>April 7th 1969</td>
        </tr>
    </tbody>
</table>

这是脚本-

jQuery(function($){
    $('.table').footable();
});

这是我正在使用的插件列表-

 <link href="css/style.css" rel="stylesheet">
  <link href="css/theme.css" rel="stylesheet">
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/jquery-ui.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/jquery-ui.min.css"> 
<link rel="stylesheet" href="css/datepicker.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/footable.core.css">
<link rel="stylesheet" href="css/footable.standalone.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script> 
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/footable.js"></script>

如果我需要添加除上述之外的任何插件，请告诉我。提前致谢。

【问题讨论】：

任何控制台错误？
没有 ..它什么也没显示@HiteshMisro

标签： javascript jquery html html-table footable

【解决方案1】：

我知道我不应该回答自己的问题，但无论如何我现在得到了解决方案，所以如果将来有人需要它，可以在这里找到它。您只需要为此添加两个插件。其余一切都正确。

 <link rel="stylesheet" href="css/footable-demos.css">
<script type="text/javascript" src="js/demos.js"></script>

它们位于 footable 的 demos 文件夹中。无论如何，谢谢。如果这有帮助，请告诉我。它对我有帮助。

【讨论】：