Jquery，表格过滤器库答案

【问题标题】：Jquery, Table filter libraryJquery，表格过滤器库
【发布时间】：2017-05-17 10:03:14
【问题描述】：

我正在使用这个插件：

tablefilter.free.fr/ex.php

在这个 js 中按照他们的例子工作：

jsfiddle.net/synysevend90/mtLYg/517/

现在我进入我的桌子，它也可以工作：

http://jsfiddle.net/synysevend90/mtLYg/518/

但是把它带到我的非 PHP 上。-

我有这个代码：

jquery：

<script>
var tf1 = setFilterGrid("form1");
</script>

文件上传

<link rel="stylesheet" type="text/css" href="../assets/TableFilter/filtergrid.css" media="screen" />
<script type="text/javascript" src="js/tablefilter.js" src="../assets/TableFilter/tablefilter_all_min.js" ></script>

我的桌子：

<form class="contacto" id="form1" style="margin-bottom:30px;">
        <table id="myTable" class="table table-hover">
            <thead>
                <tr>
                    <th style="text-align:left;">Acronimo Subcategoria</th>
                    <th style="text-align:left;">Descripcion</th>
                    <th style="text-align:left;">Acronimo Categoria</th>
                    <th style="text-align:left;">Registro Calidad</th>
                    <th style="text-align:left;">Edición</th>
                    <th style="text-align:left;">Eliminar</th>

                </tr>
            </thead>
            <?php foreach ($model->Listar() as $r): ?>
                <tr>
                    <td><?php echo $r->__GET('acro_sub'); ?></td>
                    <td><?php echo $r->__GET('descripcion'); ?></td>
                    <td><?php echo $r->__GET('acronimo_cat'); ?></td>
                    <td><?php echo $r->__GET('registro_calidad'); ?></td>

                    <td>
                        <a href="?action=editar&id=<?php echo urlencode($r->acro_sub); ?>"><img src="../../images/icon_editthis.png" width="30px" height="30px"/></a>
                    </td>
                    <td>
                        <a href="?action=eliminar&acro_sub=<?php echo urlencode($r->acro_sub); ?>"><img src="../../images/delete.png" width="30px" height="30px"/></a>
                    </td>
                </tr>
            <?php endforeach; ?>
        </table>
</form>

在HEAD我有很多文件我不觉得有问题吧？

我没有看到搜索框

【问题讨论】：

标签： jquery search html-table

【解决方案1】：

该表没有任何调用它的函数，要能够声明脚本必须在 this 的下面，这样：

<table id="myTable" class="table table-hover">
            <thead>
                <tr>
                    <th style="text-align:left;">Acronimo Subcategoria</th>
                    <th style="text-align:left;">Descripcion</th>
                    <th style="text-align:left;">Acronimo Categoria</th>
                    <th style="text-align:left;">Registro Calidad</th>
                    <th style="text-align:left;">Edición</th>
                    <th style="text-align:left;">Eliminar</th>

                </tr>
            </thead>
            <tr>
                    <td>COV</td>
                    <td>Documentos de Gobierno</td>
                    <td>GOV</td>
                    <td>N</td>

                    <td>
                        <a href="?action=editar&id=COV"><img src="../../images/icon_editthis.png" width="30px" height="30px"/></a>
                    </td>
                    <td>
                        <a href="?action=eliminar&acro_sub=COV"><img src="../../images/delete.png" width="30px" height="30px"/></a>
                    </td>
                </tr>
                                <tr>
                    <td>CUS</td>
                    <td>DOCUMENTOS DE RELACIONES EXTERNAS</td>
                    <td>EXT</td>
                    <td>N</td>

                    <td>
                        <a href="?action=editar&id=CUS"><img src="../../images/icon_editthis.png" width="30px" height="30px"/></a>
                    </td>
                    <td>
                        <a href="?action=eliminar&acro_sub=CUS"><img src="../../images/delete.png" width="30px" height="30px"/></a>
                    </td>
                </tr>

        </table>

就在脚本下方

<script language="javascript" type="text/javascript"> 
    var tf1 = setFilterGrid("myTable"); 
</script>

我正在和 Web 开发人员交谈，他不明白，因为这就是为什么库是这样工作的，我希望你能接受

【讨论】：