(075)jquery_插件_ajaxForm 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <title>plug_form.html</title>
    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <style type="text/css">
        #divtest
        {
            width: 282px;
        }
        #divtest .title
        {
            padding: 8px;
            background-color: Blue;
            color: #fff;
            height: 23px;
            line-height: 23px;
            font-size: 15px;
            font-weight: bold;
        }
        #divtest .content
        {
            padding: 8px 0px;
            background-color: #fff;
            font-size: 13px;
        }
        #divtest .content .tip
        {
            text-align:center;
            border:solid 1px #ccc;
            background-color:#eee;
            margin:20px 0px;
            padding:8px;
        }
        .fl
        {
            float: left;
        }
        .fr
        {
            float: right;
        }
    </style>
     <script type="text/javascript" src="../js/jquery/jquery190.js"></script>
     <script type="text/javascript" src="../js/jquery_form/jquery.form.js"></script>
     <script type="text/javascript">
         $(function(){
             var options = {
                 url:"http://localhost:9090/JQuery/servlet/PlugFormServlet",
                 target:".tip"
             };
             
             $("#frmV").ajaxForm(options);
         });
     </script>
  </head>
  
  <body>
        <form id="frmV" method="post" action="#">
            <div id="divtest">
                <div class="title">
                    <span class="fl">个人信息页</span> 
                    <span class="fr">
                        <input id="btnSubmit" type="submit" value="提交" />
                    </span>
                </div>
                <div class="content">
                    <span class="fl">用户名：</span><br />
                    <input id="user" name="user" type="text" /><br />
                    <span class="fl">昵称：</span><br />
                    <input id="nick" name="nickname" type="text" />
                    <div class="tip"></div>
                </div>
            </div>
        </form>
  </body>
</html>

 

 

package com.jquery.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class PlugFormServlet extends HttpServlet {

    /**
     * Constructor of the object.
     */
    public PlugFormServlet() {
        super();
    }

    /**
     * The doGet method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to get.
     * 
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
        out.println("<HTML>");
        out.println("  <HEAD><TITLE>A Servlet</TITLE></HEAD>");
        out.println("  <BODY>");
        out.print("    This is ");
        out.print(this.getClass());
        out.println(", using the GET method");
        out.println("  </BODY>");
        out.println("</HTML>");
        out.flush();
        out.close();
    }

    /**
     * The doPost method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to post.
     * 
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        String username =request.getParameter("user");
        String nickname = request.getParameter("nickname");
        String result = username + "," + nickname;
        out.println(result);
        out.flush();
        out.close();
    }

}

 

posted @ 2015-01-06 12:25  雪中飞雁  阅读(95)  评论(0)    收藏  举报