在 th:if 中使用 javascript 函数过滤一些表实体

Question

我想隐藏不满足用 javascript 函数编写的日期条件的表行。

th:onclick 属性工作正常并返回正确的比较。 但是当我在 th:if 中运行相同的函数时，如果函数没有被调用！

函数调用的语法：

情况 1：函数被调用并返回 true 或 false

<tr th:each="patient : ${patients}"  th:onclick="compareDates([[${patient.dateConverter()}]])">

我想用于表行过滤的情况 2：未调用该函数：

<tr th:each="patient : ${patients}"  th:if="compareDates([[${patient.dateConverter()}]])">

js函数如下：

<script th:inline="javascript">
/*<![CDATA[*/
    
     function compareDates(date) {
     
    var date1= document.getElementById("appDate").valueAsDate.toLocaleDateString();

    return date == date1;
}
/*]]>*/
</script>

我也尝试使用 th:hidden 属性，但出现以下错误：

Caused by: org.attoparser.ParseException: Could not parse as expression: "compareDates([[${patient.dateConverter()}]])" (template: "index" - line 277, col 50)
    at org.attoparser.MarkupParser.parseDocument(MarkupParser.java:393)
    at org.attoparser.MarkupParser.parse(MarkupParser.java:257)
    at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:230)
    ... 121 more

Answer 1

对于那些有同样挑战的人，我在 thymeleaf 生成表格后通过纯 javascript 实现了表格过滤。 js函数如下：

 function compareDates() { var rows = document.getElementsByTagName("table")[0].rows; for (let i = 1; i < rows.length; i++) { var td = rows[i].getElementsByTagName("td")[2]; var split= td.innerHTML.split(" "); if(split[0].= document.getElementById("appDate").valueAsDate.toLocaleDateString()){ rows[i].style;display = "none". } else { rows[i].style;display = "table-row"; } } }

参考：

根据条件隐藏 <td>

如何使用javascript获取表的td值