HTML頁面中資料的回顯功能
阿新 • • 發佈:2018-11-09
在第一種方式中:頁面回顯,點選detail,頁面詳情會顯示一個新的頁面。這個是通過連結將頁面連結過去的。同時這個連結還連結到了一個新的js檔案中。用去調取後端的介面。
{ title : '操作', field : 'operate', align : 'center', formatter : function(value, row, index) { var e = '<a class="btn btn-primary btn-sm '+s_detail_h+'" href="#" mce_href="#" title="詳情" onclick="detail(\'' + row.id + '\')"><i class="fa fa-edit"></i>詳情</a> '; return e; } } ]
這個就是那個js檔案
//詳情頁面 function detail(id) { if(id != undefined && id !=null){ var lay = layer.open({ type : 2, title : '', maxmin : true, shadeClose : true, // 點選遮罩關閉層 area : [ '800px', '520px' ], content : prefix + '/detail/' + id // iframe的url }); layer.full(lay) }else{ console.log("id======"+id); } }
這就去去呼叫controller層的介面去後端拿取資料了。
@Log("詳情") @GetMapping("/detail/{id}") String detail(@PathVariable("id") String id, Model model) { if(StringUtils.isNotEmpty(id)){ Detail detail = detailService.get(Long.valueOf(id)); model.addAttribute("detail", detail); } return "nsmp/analysis/detail"; }
後端返回之後,就是給了這個頁面,這個頁面通過這種方式將資料拿去。
<div class="gg-formDetail">
<div class="radio i-checks">
<label class="radio-inline">
<input type="radio" name="jugRes" value="1" th:field="${detail.jugRes}">已評審
</label>
<label class="radio-inline">
<input type="radio" name="jugRes" value="2" th:field="${detail.jugRes}">未評審
</label>
</div>
</div>