HTML页面中数据的回显功能

在第一种方式中:页面回显,点击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>

猜你喜欢

转载自blog.csdn.net/wyqwilliam/article/details/83867470
今日推荐