jQuery Tablesorter 日期选择器答案

【问题标题】：jQuery Tablesorter Date PickerjQuery Tablesorter 日期选择器
【发布时间】：2012-10-23 11:51:04
【问题描述】：

我将如何在 Tablesorter 中实现日期选择器，以便我可以在日期 01/01/2001 - 01/01/2012 之间显示结果？

我收到了以下问题，因此我对上述问题提出了疑问：

在 HTML 中显示一组表格数据，其中数据包含日期。实现过滤表格数据的日期选择器。在可能的情况下，允许通过 ajax 或 json 提要提供表格数据。

【问题讨论】：

请出示相关代码。您是否有一个包含日期字段的表格，并且您想根据 2 个日期选择器输入的值过滤表格行？还是什么？
@FabrícioMatté 这是我的表jsfiddle.net/zHRv4 我希望能够过滤特定时间段之间的数据。我被推荐使用表格分类器，但也许还有其他更好的选择。
我只需使用 2 个输入框（最小/最大日期）实现 jQuery UI datepicker 插件，然后在从 button 的 click 或 @ 调用的函数中那些inputs 中的987654326@，在选择器中获取所有包含日期的tds，并隐藏日期低于最小值或高于最大值日期的tds 的父（tr）（不要忘记由于之前的查询，在执行此操作之前将它们全部重置为可见），但我想这里的人可能有更简单的想法。
感谢@FabrícioMatté 我还需要能够以某种方式实现一项功能，以便在需要时可以从 ajax 或 JSON 提要中提供数据，您能否为我创建一个小提琴，因为我仍然很困惑
日期选择器和过滤器日期是非常不同的东西。如果你用你想要的完整行为更新上面的问题，这将节省所有相当大的努力

【解决方案1】：

正如我之前评论的那样，您可以通过简单地使用 2 jQuery UI datepickers 来做到这一点 - 一个用于最小日期，另一个用于最大日期 - 并过滤日期。

我做了一个非常简单的例子，Take a look。还有here's the commented version（您也可以结合日期选择器键入数字，这可能是一种更简单的方法）。

现在，如果您想在 div 中动态加载内容，您只需查看 jQuery's Ajax documentation 或阅读一些教程 - 这是非常基本的内容。

制作 Ajax 的最简单方法是将表格包装在 div 中，例如 tablewrapper，然后您可以使用 .load() jQuery 方法：

$('#tablewrapper').load('UrlWhichContainsMyTable.html');

在上面的示例中，您将回显整个 <table> ... </table>（或将其放在 html 文档中）。

如果你想动态加载表行，你可以对你的表使用.append和.appendTo方法：

$.get('urlWithMyNewRows.html', function(r){ //or $.post, $.ajax etc
      $('table.bordered').append(r);
});

在上面的示例中，您将从urlWithMyNewRows.html 文档中获取一组表格行<tr> 以附加到您的表格中。

ps。我将我的小提琴称为“简单”，因为我什至没有验证 maxdate 是否在 mindate 之前显示警告既不显示“未找到结果”消息，即使这些只是几行代码好吧。

【讨论】：