Thymeleaf动态刷新页面方法

Thyemlef动态刷新页面方法

最近在做项目，后端使用SSM架构，前端使用thymeleaf和bootstrap架构，在作用过程中，需要页面局部刷新，用到了3种方法，分别进行一下介绍。

一、bootstrap模态框

在管理员界面对员工进行修改时，一般都展示出清单，管理员可以在清单上对员工进行修改或其它操作，在本程序中，用到了添加员工、编辑员工信息，都采用弹出模态框的方法。

实现的代码如下：
1、按钮功能实现

添加与编辑用户按钮，指出模态框，并在jquery也没有函数中对输入框赋值。
<input type="button" value="添加用户" data-toggle="modal" data-target="#addUserModal" class="btn btn-info" style="margin-left: 10px"/>
编辑按钮中，还需要将对象参数传递进去，以便修改正确的人员
  <div class="btn btn-default btn-group-xs" role="group" aria-label="修改"
                                 th:id="${'user-modify-'+record.id}"
                                 th:edit-data-id="${record.id}"
                                 data-toggle="modal" data-target="#addUserModal"
                                 onclick="return get_employee_info(this)">编辑
                            </div>

2、JQERY函数实现

函数中根据按钮参数，通过ajax从后台获取数据，并显示模态框上。

function get_employee_info(e) {
   
    var id = e.getAttribute("edit-data-id");
    if (!id) {
   
        alert('Error！');
        return false;
    }
    $.ajax(
        {
   
            url: "/getEmployee",
            data: {
   "id": id},
            type: "get",
            beforeSend: function () {
   
                //$("#tip").html("<span style='color:blue'>正在处理...</span>");
                return true;
            },
            success: function (data) {