View 引导模式窗口和Thymeleaf

我有一个SpringMVC项目，我想使用BootstrapModalWindows和Thymeleaf。我有一个视图students.jsp，当我在没有Thymeleaf的情况下进行循环时，它会从模型中获取学生列表，一切正常。 我使用JS。但是当我使用Thymeleaf模型时，windows无法正常工作

    <table class="table table-hover">
        <thead>
            <tr>
                <th>Firstname</th>
                <th>Lastname</th>
                <th>Email</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
                <tr id="user-${user.id}" th:each="user: ${students}">

                    <td th:text="${user.id}" />
                    <td th:text="${user.firstName}" />
                    <td th:text="${user.lastName}" />
                    <td>
                        <button type="button" class="btn btn-primary editButton"
                            data-toggle="modal" data-target="#myModal" data-user-id="${user.id}">Edit</button>
                    </td>
                </tr>
        </tbody>
    </table>
    <script type="text/javascript">
        $("#myModal").on('show.bs.modal', function(e) {
            var userId = $(e.relatedTarget).data('user-id');

            var cols = $('#user-' + userId + ' td');
            var firstName = $(cols[0]).text();
            var lastName = $(cols[1]).text();
            var email = $(cols[2]).text();

            $('#firstNameInput').val(firstName);
            $('#lastNameInput').val(lastName);
            $('#emailInput').val(email);
        });

        $("#myModal").on('hidden.bs.modal', function() {
            var form = $(this).find('form');
            form[0].reset();
        });
    </script>

名字
姓氏
电子邮件
编辑
$（“#myModal”）.on（'show.bs.modal'，函数（e）{
var userId=$（e.relatedTarget）.data（'user-id'）；
var cols=$（'#user-'+userId+'td'）；
var firstName=$（cols[0]）.text（）；
var lastName=$（cols[1]）.text（）；
var email=$（cols[2]）.text（）；
$（'#firstNameInput'）.val（firstName）；
$（'#lastNameInput'）.val（lastName）；
$（'#emailInput'）.val（电子邮件）；
});
$（“#myModal”）.on（'hidden.bs.modal'，function（）{
var form=$（this.find（'form'）；
表单[0]。重置（）；
});

---

它不会从列表中获取数据。我不知道如何解决这个问题。请帮助我：）

您的“编辑”按钮中的

数据用户id

属性有一个小问题

而不是：

data-user-id="${user.id}"

……你应该：

th:data-user-id="${user.id}"

…这样该属性由Thymeleaf处理，

${user.id}

实际替换为预期值。

<tr th:each="user: ${students}" th:id="'user-' + ${user.id}">
                <td th:text="${user.id}" />
                <td th:text="${user.firstName}" />
                <td th:text="${user.lastName}" />
                <td th:text="${user.email}" />
                <td>
                    <button type="button" class="btn btn-primary editButton"
                        data-toggle="modal" data-target="#myModal"
                        th:data-user-id="${user.id}">Edit</button>
                </td>
            </tr>

编辑

谢谢：）这对我有帮助不客气：）