前台数据展示问题总结

场景一：
一个实体类中包含着另一个实体类的集合，后台查询出来后展示到前台，同时前台填写后将集合映射到实体类存入数据库。

public class Editor {
    private String finalopinion;
    private String year;
    private List<Skl_member> skl_member;
  }

public class Skl_member {
    private int projectId;
    private String projectName;
    private Long userId;
    private String memberName;
    private String memberAge;
    private String memberProfession;
    private String memberUnit;

后台查询出来后存入了model作用域中

		List<Skl_member> members = addList(memberList,editor,sysUser);
		model.addAttribute("skl_member",members);

前台展示：

<table class="table table-bordered">
      <th class="col-sm-2">姓名</th>
      <th class="col-sm-2">年龄</th>
      <th class="col-sm-3">专业职务</th>
      <th class="col-sm-5">工作单位</th>
      <tr th:each="member,status : ${skl_member}">
          <td>
              <input type="text" th:field="*{skl_member[__${status.index}__].memberName}" class="input1" th:value="${member.memberName}">
          </td>
          <td>
              <input type="text" th:field="*{skl_member[__${status.index}__].memberAge}" class="input2" th:value="${member.memberAge}">
          </td>
          <td>
              <input type="text" th:field="*{skl_member[__${status.index}__].memberProfession}" class="input3" th:value="${member.memberProfession}">
          </td>
          <td>
              <input type="text" th:field="*{skl_member[__${status.index}__].memberUnit}" class="input4" th:value="${member.memberUnit}">
          </td>
      </tr>
</table>

需要注意的是，model作用于的键值skl_member需要与实体类中的集合属性 private List<Skl_member> skl_member一致。

效果

场景二：
bootstarp中columns的操作展示按钮

 {
         title: '操作',
         align: 'center',
	   	formatter: operateFormatter
	}]
     };
     $.table.init(options);
 });


    function operateFormatter(value, row, rowIndex) {
        return [
            '<button type="button" onclick="editor(\''+row.projectId +'\',\''+row.projectStatus +'\')" class="btn btn-info" style="margin-right:15px;">项目书</button>',
            '<button type="button" onclick="wordDownload(\''+row.projectId +'\',\''+row.projectStatus +'\')" class="btn btn-warning" style="margin-right:15px;">申请书WORD</button>',
            '<button type="button" onclick="theLog(\''+row.projectId +'\')" class="btn btn-default" style="margin-right:15px;">日志查询</button>',
        ].join('');
    }

 function editor(projectId,projectStatus) {
        if (projectStatus == 1){
            $.modal.confirm("项目已提交，不可查看");
			return;
		}
         window.location.href = "/system/sklAform/editor?projectId="+projectId;
    }

效果：