Day37——员工添加页面

一. 回顾

前面学习了Day36——链接高亮以及完成列表展示数据，今天完成员工添加页面

二. 效果

三. 后台返回部门数据给前台展示

后台controller方法，如下：

 //来到员工添加页面
    @GetMapping(value="/emp")
    public String toAddPage(Model model){
        //查出所有的部门信息,在页面显示
        Collection<Department> departments = departmentDao.getDepartments();
        model.addAttribute("depts", departments);
        return "emp/add";
    }

前台展示，如下：

<select class="form-control">
    
	<option th:each="dept:${depts}" th:text="${dept.departmentName}"
	         th:value="${dept.id}">option>
select>

贴出员工添加页面的表单，如下：

<form>
	    <div class="form-group">
			<label>LastNamelabel>
			<input type="text" class="form-control" placeholder="zhangsan">
		div>
		<div class="form-group">
			<label>Emaillabel>
			<input type="email" class="form-control" placeholder="[email protected]">
		div>
		<div class="form-group">
			<label>Genderlabel><br/>
			<div class="form-check form-check-inline">
				<input class="form-check-input" type="radio" name="gender"
					   value="1">
				<label>男label>
			div>
			<div class="form-check form-check-inline">
				<input class="form-check-input" type="radio" name="gender"
					   value="0">
				<label>女label>
			div>
		div>
		<div class="form-group">
			<label>departmentlabel>
			<select class="form-control">
				
				<option th:each="dept:${depts}" th:text="${dept.departmentName}"
				         th:value="${dept.id}">option>
			select>
		div>
		<div class="form-group">
			<label>Birthlabel>
			<input class="form-control" placeholder="zhangsan">
		div>
		<button type="submit" class="btn btn-primary">添加button>
form>

四. 获取Bootstrap的form表单代码的途径