根据DropdownList From Servlets中的选定项创建表?

时间:2013-08-22 08:07:42

标签: java html jsp servlets jstl

我有一个List集合,它保存来自DB的经理和员工姓名列表。我还有另一个列表,它将项目列表保存在下拉列表中......当选择一个项目时,必须根据此项目中的项目成员和经理创建表格...例如......

从下拉列表中选择的AndroidApp项目然后它应该创建一个表格,其中包含经理和员工的名称,这样...... Html表...我尝试用jstl创建,但我无法做到。

|manager| Employee|

 Susan   |  John

 Susan   |   Joe

 Susan   |  Megan

我正在使用Java平台开发web-app项目..我有Servlets,JSP,DB,这样做。我编写了列表等。我认为我的问题在于这一点是html编码还是其他什么?我的代码......

相关的JSP页面是项目......

  <%@page import="com.eteration.leavesystem.model.Person"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>

<%@ page import="java.io.*,java.util.*,java.sql.*"%>
<%@ page import="javax.servlet.http.*,javax.servlet.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ page session="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    <form action="">
        <select name="projects" multiple>
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="opel">Opel</option>
            <option value="audi">Audi</option>
        </select> <input type="submit" value="Kaydet">
    </form>
    <br>

    <script
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">

    </script>
    <script>
        $(function(){
            $("#addProject").click(function(){
                $(this).next().slideToggle();
            });
        });
    </script>
    <button id="addProject">Proje Ekle</button>

    <div style="display:none;">
        <form action="./UserProjectServlet" method="POST">
            <input type="text" name="AddedProject" /><br/>
            <button class="hidden">Ekle</button>
        </form>
    </div>
<form action="./PopulateProjectServlet" method="get">
<select name="selectedProject" id="selectedProject" onchange= "this.form.submit()" >
    <c:forEach items="${projects}" var="project">
        <option value="${project.code}">${project.desc}"</option>
    </c:forEach>
    <table border="1" cellpadding="5">
            <caption><h2>List of users</h2></caption>
            <tr>
                <th>Manager</th>
                <th>Employees</th>         
            </tr>
            <c:forEach items="${projectTable}" var="projectTable">
                <tr>
                    <td><c:out value="${projectTable.pm.name}" /></td>
                    <td><c:out value="${projectTable.e.name}" /></td>
                </tr>
            </c:forEach>
        </table>
</select>
</form>
</body>
</html>

我成功地将项目列入下拉列表并从中获取选定的值id。然后我做了onchange方法来列出具有名称的项目信息。

我的结果类列出了项目表信息(名称)

public class ProjectResultTableView {

    static mysqlCon con=new mysqlCon();

    public static List<ProjectTable> getProjectInfo(String projectId) throws SQLException {

        List<ProjectTable> projectTableList = new ArrayList<ProjectTable>();
        String query = "SELECT distinct e.name AS employee_name, pm.name AS manager_name FROM project_employee AS pe LEFT OUTER JOIN employee AS e ON e.employee_id = pe.employee_id LEFT OUTER JOIN project AS p ON p.project_id = pe.project_id LEFT OUTER JOIN employee AS pm ON pm.employee_id = p.manager_id WHERE pe.project_id =" +projectId+ " ;";

        Statement stmt = con.getConnection().createStatement();
        ResultSet rs = stmt.executeQuery(query);

        if(rs!=null){

        while (rs.next()) {

            projectTableList.add(new ProjectTable(rs.getString("pm.name"),rs.getString("e.name")));

        }

        }


        con.getConnection().close();
        return projectTableList;
    }


}

我的服务

@WebServlet("/ProjectResultServlet")
public class ProjectResultServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;


    public ProjectResultServlet() {
        super();

    }


    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    }


    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {



        try {
            String selectedProject = request.getParameter("selectedProject");   

            List<ProjectTable> projectTable = ProjectResultTableView.getProjectInfo(selectedProject);
            request.setAttribute("projectTable", projectTable); 
            request.getRequestDispatcher("/UserHome/Projects.jsp").forward(request, response);

        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }




        request.getRequestDispatcher("/UserHome/Projects.jsp").forward(request, response);
    }

}

所以我认为它是关于我的html代码中的jstl或somethhing。如果有更多的错误请帮助我..我的问题是如何根据所选项目创建一个表而不提交按钮。我想使用onchange或类似的东西:)提前谢谢......

1 个答案:

答案 0 :(得分:0)

由于您已经在使用Jquery,因此您可以捕获onchange事件。使用selectedproject做一个Ajax到servlet并检索新表。将结果数据加载到DIV中。

请参阅http://api.jquery.com/jQuery.get/