问题在最末尾

问题在最末尾

<%@ page contentType="text/html;charset=utf-8"%>
<%@ taglib uri ="http://java.sun.com/jsp/jstl/core" prefix ="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix = "fmt" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>员工列表</title>
    <link href="css/bootstrap.css" type="text/css" rel="stylesheet"></link>
    
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.js"></script>

    <style type="text/css">
        .pagination {
            margin: 0px
        }

        .pagination > li > a, .pagination > li > span {
            margin: 0 5px;
            border: 1px solid #dddddd;
        }

        .glyphicon {
            margin-right: 3px;
        }

        .form-control[readonly] {
            cursor: pointer;
            background-color: white;
        }
        #dlgPhoto .modal-body{
            text-align: center;
        }
        .preview{

            max-width: 500px;
        }
    </style>
    <script>
        $(function () {
            
            $("#btnAdd").click(function () {
                $('#dlgForm').modal()
            });
        })


    </script>
</head>
<body>

<div class="container">
    <div class="row">
        <h1 style="text-align: center">IMOOC员工信息表</h1>
        <div class="panel panel-default">
            <div class="clearfix panel-heading ">
                <div class="input-group" style="width: 500px;">
                    <button class="btn btn-primary" id="btnAdd"><span class="glyphicon glyphicon-zoom-in"></span>新增
                    </button>
                </div>
            </div>

            <table class="table table-bordered table-hover">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>员工编号</th>
                    <th>姓名</th>
                    <th>部门</th>
                    <th>职务</th>
                    <th>工资</th>
                    <th>&nbsp;</th>
                </tr>
                </thead>
                <tbody>

                <c:forEach items = "${applicationScope.employees}" var="emp" varStatus="idx">
                <tr>
                    <td>${idx.index+1}</td>
                    <td>${emp.empno}</td>
                    <td>${emp.ename}</td>
                    <td>${emp.department}</td>
                    <td>${emp.job}</td>
                    <td style="color:red;font-weight: bold">¥
                    <fmt:formatNumber value="${emp.salary}" pattern="0,000.00"></fmt:formatNumber>
                    </td>
                </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- 表单 -->
<div class="modal fade" tabindex="-1" role="dialog" id="dlgForm">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">新增员工</h4>
            </div>
            <div class="modal-body">
                <form action="/employee/create" method="post" >
                    <div class="form-group">
                        <label for="empno">员工编号</label>
                        <input type="text" name="empno" class="form-control" id="empno" placeholder="请输入员工编号">
                    </div>
                    <div class="form-group">
                        <label for="ename">员工姓名</label>
                        <input type="text" name="ename" class="form-control" id="ename" placeholder="请输入员工姓名">
                    </div>
                    <div class="form-group">
                        <label>部门</label>
                        <select id="dname" name="department" class="form-control">
                            <option selected="selected">请选择部门</option>
                            <option value="市场部">市场部</option>
                            <option value="研发部">研发部</option>
                        	<option value="后勤部">后勤部</option>
                        </select>
                    </div>

                    <div class="form-group">
                        <label>职务</label>
                        <input type="text" name="job" class="form-control" id="sal" placeholder="请输入职务">
                    </div>

                    <div class="form-group">
                        <label for="sal">工资</label>
                        <input type="text" name="salary" class="form-control" id="sal" placeholder="请输入工资">
                    </div>

                    <div class="form-group" style="text-align: center;">
                        <button type="submit" class="btn btn-primary">保存</button>
                    </div>
                </form>
            </div>

        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


</body>
</html>
package com.imooc.employee;
import java.io.IOException;
import java.util.List;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/create")
public class CreateServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
    public CreateServlet() {
        super();
    }
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("UTF-8");
		String empno = request.getParameter("empno");
		String ename = request.getParameter("ename");
		String department = request.getParameter("department");
		String job = request.getParameter("job");
		String salary = request.getParameter("salary");
		System.out.println("empno");
		Employee emp = new Employee(Integer.parseInt(empno),ename,department,job,salary);
		ServletContext context = request.getServletContext();
		List employees = (List)context.getAttribute("employees");
		employees.add(emp);
		context.setAttribute("employees", employees);
		request.getRequestDispatcher("/employee.jsp").forward(request, response);
	}
}
package com.imooc.employee;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/list")
public class ListServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
    public ListServlet() {
        super();
    }
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		ServletContext context = request.getServletContext();
		if(context.getAttribute("employees")==null){
			List list = new ArrayList();
			Employee emp = new Employee(666,"李海","市场部","客户代表","10000");
			list.add(emp);
			list.add(new Employee(777,"张明","研发部","运维工程师","8000"));
			context.setAttribute("employees", list);
		}
		request.getRequestDispatcher("/employee.jsp").forward(request, response);
	}
}
package com.imooc.employee;

public class Employee {
	private int empno;
	private String ename;
	private String department;
	private String job;
	private String salary;
	
	public Employee(int empno, String ename, String department, String job, String salary) {
		super();
		this.empno = empno;
		this.ename = ename;
		this.department = department;
		this.job = job;
		this.salary = salary;
	}
	public int getEmpno() {
		return empno;
	}
	public void setEmpno(int empno) {
		this.empno = empno;
	}
	public String getEname() {
		return ename;
	}
	public void setEname(String ename) {
		this.ename = ename;
	}
	public String getDepartment() {
		return department;
	}
	public void setDepartment(String department) {
		this.department = department;
	}
	public String getJob() {
		return job;
	}
	public void setJob(String job) {
		this.job = job;
	}
	public String getSalary() {
		return salary;
	}
	public void setSalary(String salary) {
		this.salary = salary;
	}
	
}

http://img1.sycdn.imooc.com//climg/5f448f1709c79ca913420710.jpg

1、改完employee.jsp之后,页面的css修饰效果失效,表现为:添加表单不能隐藏,显示出来的表单排版改变

2、新建Employee对象时,工资属性金额加上f之后报错,

正在回答

登陆购买课程后可参与讨论,去登陆

8回答

同学你好,Tomcat的webapps目录下存放的是我们的web应用。当启动Tomcat时,会将项目WebContent下的所有内容部署到webapps下,如下:

http://img1.sycdn.imooc.com//climg/5f4710c4098a981a06040259.jpg

不会部署WebContent。所以不需要加WebContent。

祝学习愉快~

好帮手慕阿慧 2020-08-26 17:15:51

同学你好,同学的路径中多写了/WebContent,应该去掉哦。

参考代码如下:

http://img1.sycdn.imooc.com//climg/5f46283a09789b4313830460.jpg

同学可以复制如下代码:

<link href="${pageContext.request.contextPath }/css/bootstrap.css" type="text/css" rel="stylesheet"></link>

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

  • 提问者 森林sng #1
    老师,他不就是在WebContent下面吗?为什么去掉之后反而行了呢
    2020-08-26 20:51:11
提问者 森林sng 2020-08-26 12:48:14

老师,还是不行

http://img1.sycdn.imooc.com//climg/5f45e97e09aea80400000000.jpg

好帮手慕阿慧 2020-08-26 10:23:34

同学你好,css等静态文件应该放在WebContent下。如下:

http://img1.sycdn.imooc.com//climg/5f45c79f09de88fa02760396.jpg

同学修改完后,重启Tomcat再访问试试。

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

提问者 森林sng 2020-08-25 22:10:34

老师,改完之后还是不行

http://img1.sycdn.imooc.com//climg/5f451bc509c043fb19201030.jpg

  • 提问者 森林sng #1
    页面没有一点变化
    2020-08-25 22:11:15
好帮手慕阿慧 2020-08-25 16:49:51

同学你好,

1、你的代码测试没有问题,页面排版不会改变。页面的css样式失效可能是css文件路径错误,同学可以使用绝对路径试试。

以bootstrap.css为例,参考代码如下:

<link href="${pageContext.request.contextPath }/css/bootstrap.css" type="text/css" rel="stylesheet"></link>

http://img1.sycdn.imooc.com//climg/5f44d06f09d2b4dd12360427.jpg

2、在本项目中,需要先访问/list,将employees集合存储到ServletContext作用域。添加员工时,会将员工对象添加到了employees集合中,所以可以不重新放进去,可以不调用setAttribute()方法。这是因为employees集合在servletContext作用域中,页面上遍历的是作用域中employees集合中的数据。

如下:

http://img1.sycdn.imooc.com//climg/5f44d0fb0938d0c807380402.jpg

3、一般到学习了SSM,MyBatis框架,SpringBoot后看源码比较好。

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

提问者 森林sng 2020-08-25 12:50:59

我听网上说要多看源码,一般什么时期看比较好啊

提问者 森林sng 2020-08-25 12:38:37

第二个程序的

context.setAttribute("employees", employees);

对于context存储中的employees对象,是重新存储,还是更新存储,为什么需要重新放进去,而不是在它的存储的List中添加employees.add(emp);之后自动更新

它的原理是什么

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师