Servlet实现表单提交(MyEclipse10,Tomcat7.0,JDK1.7,)——Java Web练习(一)

1.MyEclipse|File|New|Project|Web Project    填写Project Name:exServlet,点选Java EE 6.0(配套Tomcat7.0)

2.代码结构如下:

3.修改index.jsp页面,完整代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>火车票订票系统</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
  </head>
  
  <body>
       <!-- 界面布局 -->    
       <div align="center">
       <div class="style">
       <table width="1024"  height="150" cellpadding="0" cellspacing="0" >
               <!-- 动态首页订票界面 同时获取年月日和动态滚动消息 -->
            <tr>
                <td colspan="2">
                    <img src="./images/logo.jpg" alt="logo" width="1024" height="149">
                </td>
            </tr>        
            <tr>
                <td width="205"  bgcolor="#b7d7ec">
                    <p align="center">
                    <!-- 注意:方法today.getYear()已经过时,需要添加1900 -->
                    <script language=JavaScript>
                    today = new Date();
                    function initArray(){
                    this.length=initArray.arguments.length;
                    for(var i=0;i<this.length;i++)
                    this[i+1]=initArray.arguments[i];  }
                    var d=new initArray(
                    "星期日","星期一","星期二","星期三","星期四",    "星期五","星期六");
                    document.write("<font color=##ff0000 style='font-size:12pt;font-family: 宋体'> ",
                    today.getYear()+1900,"",today.getMonth()+1,"",today.getDate(),"",d[today.getDay()+1],
                                  "</font>" );
                    </script> 
                    </p>    
                </td>    
                <td width="819" bgcolor="#b7d7ec">
                    <marquee  direction="left" onmouseover=this.stop() onmouseout=this.start() scrollAmount=3 scrollDelay=100>
                     <FONT style="FONT-SIZE: 18px"color=blue>欢迎使用火车票订票系统管理系统 ,如有不足,敬请指导!</FONT>
                    </marquee>
                </td>
            </tr>
      </table>
      </div>
      
      <table width="100%" height="75%" border="0" align="center">
          <tr>
            <td width="40%" height="20%"> </td>
            <td width="20%" >    
              <!-- 中间登录部分布局 提交表单  配置web.xml -->
              <form action="loginAction.do">
              <table width="500" height="80%" border="2" bordercolor="#12A0F5"  bgcolor="#dfeaf1">
               <tr>
                 <td></td>
                 <td align="center"><br />系统管理员登录 <br/><br/>
                       用户名:<input type="text" name="userid" size="19" maxlength="19" /><br/><br/>
                       密 码:<input type="password" name="password" size="20" maxlength="19" /><br /><br />
                    <input type="submit" name="Submit" value="登录"/>    
                    <input type="reset" name="Submit" value="重置" /><br/>                                   
                </td>
                <td></td>
              </tr>
          </table>
          </form>
          </td>
          <td width="40%"></td>
          </tr>
          <tr><td height="67" colspan="3">  
             <!-- 底部版权所有界面 -->
            <TABLE class=wrapper border=0 cellSpacing=0 cellPadding=0 width="100%" align=center>
             <TBODY>
              <TR>
                    <TD style="LINE-HEIGHT: 150%" align="center"> 
                  <HR style="WIDTH: 96%; HEIGHT: 4px; COLOR: #02457c">
                  <font size="2"> <SCRIPT language=javascript src=""></SCRIPT>
                  <!-- target=_blank开启新的网页 -->
                  <BR><A href="aboutme.jsp" target=_blank>关于我们</A> | <A href="wzsm.jsp">网站声明</A>
                   <BR>版权所有&copy;2014-2015 北京理工大学 Eastmount <BR>京ICP备10009636号 </font>
                  </TD>
              </TR>
             </TBODY>
            </TABLE>
          </td>
         </tr>
        </table>
      </div>
  </body>
</html>
View Code

4.新建图片、样式文件夹,并导入图片,书写样式文件代码,代码如下:

.main {
    width: 1024px;
    text-align:left;
}
.font {
    font-family: "Trebuchet MS";
    font-size: 14px;
    font-weight: bold;
    color: #FFFFFF;
}
.div {
    margin: 0px;
    padding: 0px;
    width: 1014px;
}
.tdBgColor{
    background-color:#6b1101;
}
a{
    font-family: "Trebuchet MS";
    font-size: 14px;
    font-weight: bold;
    color: #FFFFFF;
    line-height:50px;
    text-decoration:none;

}
a.hover{
    font-family: "Trebuchet MS";
    font-size:14px;
    font-weight: bold;
    color:#0000FF;
    line-height:50px;
    text-decoration:underline;
    padding-bottom:1px;

}
a.visited{
    font-family: "Trebuchet MS";
    font-size:14px;
    font-weight: bold;
    color:#000066;
    line-height:50px;
    text-decoration:none;
}
a.active{
    font-family: "Trebuchet MS";
    font-size:14px;
    font-weight: bold;
    color:#0000FF;
    line-height:50px;
    text-decoration:none;
    padding-bottom:1px;
}
View Code

5.新建package、java代码文件(此处即为Servlet),代码如下:

package servlet;

import java.io.IOException;
import java.sql.*; //导入数据库处理所有库
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.swing.JOptionPane;

//用户登录处理Servlet 系统登录主页处理表单
public class HomePageAction extends HttpServlet {
    
    private Connection cn=null;     //定义数据库连接对象
    private String driverName=null; //数据库驱动器
    private String url=null;        //数据库地址URL
    
    //初始化方法,取得数据库连接对象
    public void init(ServletConfig config) throws ServletException
    {
        super.init(config);
        driverName=config.getInitParameter("driverName");
        url=config.getInitParameter("url");
        
        try {
            Class.forName(driverName);
            cn=DriverManager.getConnection(url);
        } catch(Exception e) {
            System.out.println("取得数据库连接错误:"+e.getMessage());
        }
    }
    
    //处理GET请求方法
    public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException
    {
        //取得用户注册表单提交的数据
        String userid=request.getParameter("userid");
        String password=request.getParameter("password");
        //判断登录账号为空,则自动跳转到注册页面
        if(userid==null||userid.trim().length()==0) {
            response.sendRedirect("index.jsp");
            JOptionPane.showMessageDialog(null, "User name or password can't be empty!");
        }
        //判断登录密码为空
        if(password==null||password.trim().length()==0) {
            response.sendRedirect("index.jsp");
            JOptionPane.showMessageDialog(null, "User name or password can't be empty!");
        }
        //查询数据库和跳转到登录主界面
        try {
            //查询数据库操作
            
            //跳转到主界面
            response.sendRedirect("success.jsp");
        } catch(Exception e) {
            System.out.println("错误:"+e.getMessage());
            response.sendRedirect("index.jsp");
        }
    }
    
    //处理POST请求方法
    public void doPost(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException 
    {
        doGet(request,response);
    }
    
    //销毁方法
    public void destroy() {
        super.destroy();
        try {
            cn.close();
        }catch(Exception e) {
            System.out.println("关闭数据库错误:"+e.getMessage());
        }
    }        
}
View Code

6.修改配置文件web.xml,使index.jsp页面可以定位到java文件(Servlet),代码如下:(主要是<servlet>标签和<servlet-mapping>标签,其他标签无关紧要)

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
    http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
    <display-name></display-name>
    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>HomePageAction</servlet-name>
        <servlet-class>servlet.HomePageAction</servlet-class>
        <init-param>
            <param-name>driveName</param-name>
            <param-value>sun.jdbc.odbc.JdbcOdbcDriver</param-value>
        </init-param>
        <init-param>
            <param-name>url</param-name>
            <param-value>jdbc:odbc:cityoa</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>HomePageAction</servlet-name>
        <url-pattern>/loginAction.do</url-pattern>
    </servlet-mapping>
</web-app>
View Code

7.新建Servlet调用的返回页面success.jsp,代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>验证成功界面</title>
    
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->

  </head>
  
  <body>
        界面表单提交跳转成功 <br>
        <a href="index.jsp">返回</a>
  </body>
</html>
View Code

 

8.效果图:

       

  返回界面:

     

 

总结调用路径:


引用出处:http://www.bkjia.com/ASPjc/995763.html

 

posted @ 2016-04-12 17:35  ccjcjc  阅读(548)  评论(0编辑  收藏  举报