Spring Boot蒲公英数据表Thymeleaf在日期之间搜索

Posted

技术标签:

【中文标题】Spring Boot蒲公英数据表Thymeleaf在日期之间搜索【英文标题】：Spring Boot Dandelion Datatables Thymeleaf search between dates 【发布时间】：2017-06-13 02:48:45 【问题描述】：

我是带有 Spring Boot 和 thymeleaf 的蒲公英数据表。

这是我要在其中显示所有日志的表格的代码。

<table class="table table-bordered" id="expiredUsersTable" dt:table="true">
    <thead>
    <tr>
        <th dt:sortInitDirection="desc">TIME</th>
        <th dt:filterable="true" dt:filterType="select">Log Level</th>
        <th>Message</th>
    </tr>
    </thead>
    <tbody>
    <tr th:each="log : $logs">
        <td th:text="$log?.getFormattedDate()"></td>
        <td th:text="$log?.level"></td>
        <td th:text="$log?.message"></td>
    </tr>
    </tbody>
</table>

我想在此表的日期范围之间添加过滤器，但我无法使用蒲公英数据表实现此目的。有哪些方法可以做到这一点？

【问题讨论】：

【参考方案1】：

在百里香中，这看起来像这样：

控制器：

// Create these dates however you want, these example dates are filtering between 1950 and 1960.
GregorianCalendar gc = new GregorianCalendar();
gc.set(Calendar.YEAR, 1950);
model.put("start", gc.getTime());

gc.set(Calendar.YEAR, 1960);
model.put("end", gc.getTime());

百里香：

<table class="table table-bordered" id="expiredUsersTable" dt:table="true">
    <thead>
        <tr>
            <th dt:sortInitDirection="desc">TIME</th>
            <th dt:filterable="true" dt:filterType="select">Log Level</th>
            <th>Message</th>
        </tr>
    </thead>

    <tbody>
        <tr th:each="log : $logs" th:unless="$log.date.before(start) OR log.date.after(end)">
            <td th:text="$log?.formattedDate"></td>
            <td th:text="$log?.level"></td>
            <td th:text="$log?.message"></td>
        </tr>
    </tbody>
</table>

【讨论】：

我正在寻找解决此问题的 javascript 方法。抱歉忘记说明了。【参考方案2】：

数据表站点有范围过滤的例子：https://datatables.net/examples/plug-ins/range_filtering.html

我不得不猜测你使用的日期格式（这个例子使用的是 dd-mm-yyyy），这样的事情对我有用：

HTML：

<body onload="initFilter();">
    From <input type="text" id="start" /> to <input type="text" id="end" />

JavaScript：

<script>
    // <![CDATA[
    function parseDate(date) 
        if (date.length < 10)
            return false;

        var parts = date.split("-");
        var d = parseInt(parts[0]);
        var m = parseInt(parts[1]) - 1;
        var y = parseInt(parts[2]);

        return new Date(y, m, d);
    

    function initFilter() 
        $.fn.dataTable.ext.search.push(
            function(settings, data, dataIndex) 
                var start = parseDate($('#start').val());
                var end = parseDate($('#end').val());
                var data = parseDate(data[0]);

                var valid = true;
                valid = valid && (!start || (start.getTime() =< data.getTime()));
                valid = valid && (!end || (end.getTime() > data.getTime()));
                return valid;
            
        );

        $('#start, #end').keyup( function() 
            oTable_expiredUsersTable.draw();
        );
    
    // ]]>
</script>

【讨论】：

以上是关于Spring Boot蒲公英数据表Thymeleaf在日期之间搜索的主要内容，如果未能解决你的问题，请参考以下文章

如果我们在Spring Boot中以编程方式配置数据源，spring boot数据源属性是否有效

Spring Boot加密属性文件数据

Spring boot在Spring boot中Redis的使用

Spring Boot 实用MyBatis做数据库操作

43. Spring Boot动态数据源（多数据源自动切换）从零开始学Spring Boot

spring boot：Spring Boot中Redis的使用