对页面加载后提交按钮时出现的表格进行排序答案

【问题标题】：Sort a table that appears when a submit button after the page has loaded对页面加载后提交按钮时出现的表格进行排序
【发布时间】：2016-11-07 08:27:26
【问题描述】：

我在使用 tablesorter jquery 插件时遇到了一些麻烦。问题是我有一个视图，当单击提交按钮时，根据表单的搜索，会加载一个包含数据库信息的表。此表仅在单击“搜索”按钮时显示，并不总是显示相同的信息。我曾尝试使用 tablesorter jquery 插件，但它似乎不起作用。我在打电话：

<script src="/js/jquery-1.12.1.min.js" type="text/javascript"></script>
<script src="js/jquery.tablesorter.min.js"></script>
<head>
<script>
function sort_my_table(){
$('my_table').tablesorter();
}
</script>
</head>

然后是下表。

当我按下此按钮时，表格显示在页面底部，该按钮正在提交一个表单，您可以在其中输入所需信息，然后使用此信息进行搜索，表格显示结果搜索：

 <input type="submit" class="btn btn-primary" value="search" name="send">

我的桌子是这样的：

<thead>
                <tr>
                    <th  style="text-align:center">Code</th>
                    <th  style="text-align:center">Name</th>
                    <th  style="text-align:center">Description</th>
                </tr>    
            </thead>

            <?php foreach ($elements as $element) { ?>
            <tbody> 
                <tr>
                        <td><?php echo $element->fabr?></td>
                        <?php if (count($element->place) > 0) { ?>
                                <td>
                                <?php foreach ($element->place as $pl) { ?>
                                    <?php echo $pl['name'] ?><br>
                                <?php } ?>
                                </td>
                                <td>
                                <?php foreach ($element->place as $pl) { ?>
                                    <?php echo $pl['number'] ?><br>
                                <?php } ?>
                                </td>
                            <?php } else { ?>
                            <td></td>
                            <td></td>
                            <?php } ?>                           
                </tr>
            <?php } ?>
            </tbody> 
    </table>

我真的不知道如何使用它或如何使它工作。

【问题讨论】：

确保 my_table 是一个“正确的”css 选择器...它应该使用类名（句点；.my_table）或 id（哈希；#my_table）来定位表。

标签： javascript jquery sorting html-table tablesorter

【解决方案1】：

在加载文档时告诉表格排序器对表格进行排序：

$(document).ready(function() 
    { 
        $('my_table').tablesorter();
    } 
);

单击标题，您会看到您的表格现在可以排序了。（这仅在表本身未被直接操作或覆盖时才有效）

http://tablesorter.com/docs/#Demo

【讨论】：

我尝试添加它，但它不起作用。问题是当文档被加载时，表格还没有在页面中。只有当我点击搜索按钮时才会显示。
如何实现隐藏和显示？通过 jquery ".hide()" 和 ".show()" ？你能提供更多你的代码吗？

【解决方案2】：

听起来您需要移动单击时触发的脚本。

如果你希望它在点击之前加载，你可以使用这个：

https://jsfiddle.net/MaXiNoM/4ggnL81h/

$(function(){
  $("#myTable").tablesorter();
});

如果您希望表格为空白，则将其传递为空参数，这将允许您加载空白表格。这听起来是从 onclick 触发的调用，这也是在呈现和填充表格时。您可以尝试直接从那里接听电话并将其放入您的 onload 中。

【讨论】：