Question

我在eclipse中创建一个项目，我希望在表格中显示输入到表单中的值。我希望表只显示具有值的行，但无法解决如何执行此操作。到目前为止，我刚刚添加了多行并使用display:none以便不显示它们，但我无法想到让th:text="${name1}"显示的方法。

这是我到目前为止这样做的一个例子：

<table id="table">
    <tr id="tableRow">
      <th class="tableHeader">Name</th>
      <th class="tableHeader">Description</th>
    </tr>
    <tr id="tableRow" style="display:none">
      <td class="tableCell" th:text="${name1}"></td>
      <td class="tableCell" th:text="${description1}"></td>
    </tr>
    <tr id="tableRow" style="display:none">
      <td class="tableCell" th:text="${name2}"></td>
      <td class="tableCell" th:text="${description2}"></td>
    </tr>
    <tr id="tableRow" style="display:none">
      <td class="tableCell" th:text="${name3}"></td>
      <td class="tableCell" th:text="${description3}"></td>
    </tr>
</table>

我对编码比较陌生，所以任何帮助都会受到赞赏。

Answer 1

您需要在使用之前测试值

＆＃13;

<table id="table">
        <tr id="tableRow">
            <th class="tableHeader">Name</th>
            <th class="tableHeader">Description</th>
        </tr>
        <tr id="tableRow" th:if="${name1 != null or description1 != null}">
            <td class="tableCell" th:text="${name1}"></td>
            <td class="tableCell" th:text="${description1}"></td>
        </tr>
        <tr id="tableRow" th:if="${name2 != null or description2 != null}">
            <td class="tableCell" th:text="${name2}"></td>
            <td class="tableCell" th:text="${description2}"></td>
        </tr>
        <tr id="tableRow" th:if="${name3 != null or description3 != null}">
            <td class="tableCell" th:text="${name3}"></td>
            <td class="tableCell" th:text="${description3}"></td>
        </tr>
</table>

＆＃13;

Answer 2

我找到了一种使用th:each：

的好方法

    <table id="table">
        <tr id="tableRow">
            <th class="tableHeader">Name</th>
            <th class="tableHeader">Description</th>
        </tr>
        <tr id="tableRow" th:each="inputMap : ${InputMap}">
            <td class="tableCell" th:text="${inputMap.value.name}"></td>
            <td class="tableCell" th:text="${inputMap.value.description}"></td>
        </tr> 
    </table>

${InputMap}来自我的控制器：

@GetMapping("/tablePage")
public void getTableData(Model model) {

    inputRepository.findAll().forEach(inputObject -> {
        inputMap.put(inputObject.id, inputObject);
    });

    if (inputMap != null){
        inputMap.forEach((id, i) -> {
            model.addAttribute(id + "name", id + i.getName());
            model.addAttribute(id + "description", id + i.getDescription());
        });
    }

    model.addAttribute("InputMap", inputMap);
}

如何在值为空时隐藏表行

2 个答案: