Question

我有一个名为 #searchess 的搜索文本框附加了一个日期选择器小部件，搜索文本框应该使用文本框中的任何日期搜索表 #esstable 。但是，当我从datepicker中选择一个日期时，日期会进入文本框，但在我输入内容之前不会搜索该表。

<script>

          $(function() {
                $( "#searchess" ).datepicker({
                 dateFormat: " yy-mm-dd"
                });
            });

        $("#searchess").keyup(function() {
        var value = this.value;

            $("#esstable").find("tr").each(function(index) {
                if (!index) return;
                var id = $(this).find("td").first().text();
                $(this).toggle(id.indexOf(value) !== -1);
                });
            });

</script>

这是我的 #searchess 文本框搜索：

<input type="text" id="searchess" placeholder="ESS Date Search"></input>

这是表格：

<div id="esstable">
             <table>
                <tbody>
                    <tr>
                      <th>Date</th>
                      <th>ESS File</th>
                    </tr>
                    <tr>
                      <td> 2014-03-17 </td>
                      <td> <a href="./file1"> file ex1</a></td>
                    </tr>
                    <tr>
                      <td> 2013-03-17 </td>
                      <td> <a href="./file2"> file ex2</a></td>
                    </tr>
                </tbody>
             </table>
          </div>

Answer 1

这是因为您的搜索是从键盘事件触发的，而日历在您选择日期时不会触发。但您可以使用以下命令添加该功能：

$("#searchess").datepicker({
    dateFormat: " yy-mm-dd",
    onSelect: function () {
        $("#searchess").trigger('keyup')
    }
});

<强> jsFiddle example

通过表搜索Datepicker值？

1 个答案: