如何将Java对象传递至Bootstrap模态框并展示？

你现在遇到的核心问题是直接把Java对象放到data-whatever属性里，最终拿到的只是对象的toString()结果（类似com.yourpackage.User@xxxxxx），根本没法直接使用。得把Java对象序列化成JSON字符串，再在前端解析成JS对象来处理，具体步骤如下：

1. 后端将Java对象转为JSON字符串 #

首先要把你的${u}对象转成合法的JSON字符串，不同模板引擎的处理方式略有不同：

• Thymeleaf：用内置的JSON工具类直接序列化，注意用单引号包裹属性值，避免和JSON里的双引号冲突：

<td>
  <a href="#" class="btn btn-warning edit" data-toggle="modal" 
     data-whatever='[[${#json.stringify(u)}]]' 
     data-target="#exampleModal">编辑</a>
</td>

• JSP：可以用Gson/Jackson等工具在后端序列化，再用<c:out>转义输出：
  先在后端把Gson实例放入request域：

  request.setAttribute("gson", new Gson());
  

  然后JSP里：

  <td>
    <a href="#" class="btn btn-warning edit" data-toggle="modal" 
       data-whatever='<c:out value="${gson.toJson(u)}" />' 
       data-target="#exampleModal">编辑</a>
  </td>
  

2. 前端解析JSON并填充模态框 #

在Bootstrap的模态框显示事件里，把拿到的JSON字符串转成JavaScript对象，再把属性值填充到模态框的对应元素中：

$('#exampleModal').on('show.bs.modal', function (event) {
  // 获取触发模态框的按钮
  var triggerBtn = $(event.relatedTarget);
  // 解析JSON字符串为JS对象
  var user = JSON.parse(triggerBtn.data('whatever'));
  var modal = $(this);

  // 示例：填充模态框里的元素，根据你的实际DOM结构修改
  modal.find('.modal-title').text('编辑用户：' + user.username);
  modal.find('#user-id').val(user.id);
  modal.find('#user-email').val(user.email);
  modal.find('#user-phone').text(user.phone);
});

注意事项 #

• 确保Java对象的属性有public的getter方法（或者属性本身是public），这样JSON序列化工具才能正确读取属性值。
• 如果对象里包含特殊字符（比如引号、换行），JSON序列化会自动处理转义，只要用单引号包裹data-whatever的值就不会出现语法错误。
• 如果你用的是Spring Boot，默认已经集成了Jackson，Thymeleaf的#json.stringify就是基于它的，不需要额外依赖。

内容的提问来源于stack exchange，提问作者Light