一、接业务，作分析

1、大致业务要求

1.1　使用 JSP+Servlet 实现理财产品信息管理系统，MySQL5.5 作为后台数据库，实现查看理财 和增加理财功能

1.2　查询页面效果图

1.3　添加新信息页面效果图

2、查询页面要求

2.1　打开首页页面，默认显示所有记录，且按发售起始日降序排序，查询列表使用样式实现标题字 体、标题背景色和隔行变色效果

分析：初始页面为 Servlet 然后返回至主界面，且包括 ArrayList<> 集合框架的返回值。主页中通过 <c:forEach 在表格中显示数据并控制行数，在 <c:forEach 中添加 <c:if 判断当前是第几条信息，若为偶数次数，则给出相应的 css 样式 相反，加一个 <c:if 去控制非偶数次数的信息，不给出 css 样式

 <c:forEach items="${requestScope.fdata }"  begin="0" var="f" varStatus="status">

     <c:if test="${status.index%2==0}">

         <tr align="center">

             <td>

                 ${f.getId() }

             </td>

             <td>

                 ${f.getRisk() }

             </td>

             <td>

                 ${f.getIncome() }

             </td>

             <td>

                 ${f.getSaleStarting() }

             </td>

             <td>

                 ${f.getSaleEnd() }

             </td>

             <td>

                 ${f.getEnd() }

             </td>

         </tr>

     </c:if>

     <c:if test="${status.index%2!=0}">

         <tr class="tabletrBackGroundHui" align="center">

             <td>

                 ${f.getId() }

             </td>

             <td>

                 ${f.getRisk() }

             </td>

             <td>

                 ${f.getIncome() }

             </td>

             <td>

                 ${f.getSaleStarting() }

             </td>

             <td>

                 ${f.getSaleEnd() }

             </td>

             <td>

                 ${f.getEnd() }

             </td>

         </tr>

     </c:if>

 </c:forEach>

<c:forEach

2.2　其中产品代码为模糊查找，理财风险评级下拉框中包括：R1、R2、R3 三种风险类型，当选择 某一种理财风险评级后，点击“查询”按钮，筛选出符合条件的理财信息

分析：两条输入框有四种情况，根据不同的四种情况作出不同的查询语句查询

注：若皆为空，默默查询全部信息

 sql="select * from financingproduct where id like '%"+id+"%' and risk like '%"+fx+"%'";

模糊查询语句

3、添加新拍产品信息页面要求

3.1　当用户输入产品代码后，使用 Ajax 异步校验所输入的产品代码是否与数据库中已经存在的记录的产品代码重复，如果重复，则给出提示“代码不可用”，反之提示“代码可用”

分析:将输入信息传至 Servlet 中，调用数据库，查询该数据是否存在于数据库中。返回 boolean 型值

3.2　当点击“保存”按钮后，要求使用 jQuery 编码实现对输入数据的内容验证，要求所有输入项不能为空，风险评级不能是默认选项“――请选择――”，日期必须满足“yyyy-MM-dd”的格式

分析：将按钮绑定事件，在事件中先完成数据的校验，再将表单提交至 Servlet ，返回数据库影响行数。给出提示信息，如果成功则给出信息后跳转至 GetListServlet 中获取数据，转到主页面显示全部信息

3.3　当输入数据验证通过后，则提交至新增理财的 Servlet，进行中文乱码处理并实现数据保存。 如添加成功则给出成功提示，如添加失败则给出失败信息并跳转至新增理财页面。

分析：表单提交后在 Servlet 中验证，使用 if 语句根据不同结果返回添加页面，给出结果信息

二、架构设计思路

三、数据库设计

四、项目框架搭建

4.1、jsp 页面实现

4.1.1　查询信息的主页面

                 <tr class="tabletrBackGroundHui"><td>产品代码</td><td>风险评级</td><td>预期收益</td><td>发售起始日</td><td>发短信截止日</td><td>产品到期日</td></tr>

                 <c:forEach items="${requestScope.fdata }"  begin="0" var="f" varStatus="status">

                     <!--   <c:set var="i" scope="session" value="${2000*2}"/><c:out value="${salary}"/>   -->

                     <c:if test="${status.index%2==0}">

                         <tr align="center"><td>${f.getId() }</td><td>${f.getRisk() }</td><td>${f.getIncome() }</td><td>${f.getSaleStarting() }</td><td>${f.getSaleEnd() }</td><td>${f.getEnd() }</td></tr>

                     </c:if>

                     <c:if test="${status.index%2!=0}">

                         <tr class="tabletrBackGroundHui" align="center"><td>${f.getId() }</td><td>${f.getRisk() }</td><td>${f.getIncome() }</td><td>${f.getSaleStarting() }</td><td>${f.getSaleEnd() }</td><td>${f.getEnd() }</td></tr>

                     </c:if>

                 </c:forEach>

查询页面部分代码

4.1.2　添加新信息的添加页面

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

此页面需要使用 ajax 在<head>中导入

 <script type="text/javascript">

 //    验证，产品代码是否可用

     function check() {

         var productId = document.getElementById("productId");

         if (productId.value != "") {

             //document.write(userid.value);

             //document.getElementById("userid").innerHTML="hellod";

             if (window.XMLHttpRequest) {

                 xmlhttp = new XMLHttpRequest();

             } else {

                 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

             }

             xmlhttp.onreadystatechange = function() {

                 if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

                     document.getElementById("AjaxTsInfo").innerHTML = xmlhttp.responseText;

                     //alert("hello");

                 }

             };

             xmlhttp.open("POST", "CheckServlet?productId=" + productId.value,true);

             xmlhttp.send();

         } else if (productId.value == "") {

             document.getElementById("AjaxTsInfo").innerHTML = "内容不能为空";

         }

     }

 </script>

 <script type="text/javascript">

     // 使用 jQuery 实现表单提交内容验证，并弹出警告框

     $(function() {

         $("#savesave").bind('click', sendsms);

         function sendsms() {

             if ($("#productId").val() == "" || $("#productSy").val() == ""

                     || $("#productSt").val() == ""

                     || $("#productEn").val() == ""

                     || $("#productDq").val() == "") {

                 alert("内容不能为空");

                 return false;

             }

             if ($("#productFx").val() == null) {

                 alert("请选择产品风险级别");

                 return false;

             }

             // dateFormat = /^(\d{4})-(\d{2})-(\d{2})$/;

             var str1 = $("#productSt").val();

             var str2 = $("#productEn").val();

             var str3 = $("#productDq").val();

             // if (dateFormat.test(str1) && dateFormat.test(str2){}

             function isDate(dateString) {

                 if (dateString.trim() == "")

                     return true;

                 //年月日正则表达式

                 var r = dateString.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);

                 if (r == null) {

                     alert("请输入格式正确的日期\n\r日期格式：yyyy-mm-dd\n\r例    如：2008-08-08\n\r");

                     return false;

                 }

                 var d = new Date(r[1], r[3] - 1, r[4]);

                 var num = (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4]);

                 if (num == 0) {

                     alert("请输入格式正确的日期\n\r日期格式：yyyy-mm-dd\n\r例    如：2008-08-08\n\r");

                 }

                 return (num != 0);

             }

             if(isDate(str1) && isDate(str2) && isDate(str3)){

                 // alert($("#AjaxTsInfo").text());

                 // $("#AjaxTsInfo").val($('#pageNum').text())

                 if($.trim($("#AjaxTsInfo").text()) == "代码可用"){    

                     // 方式二，

                     $.ajax({

                     //几个参数需要注意一下

                         type: "POST",//方法类型

                         dataType: "text",//预期服务器返回的数据类型

                         url: "AddServlet" ,//url

                         data: $('#form1').serialize(),

                         success: function (result) {

                             // console.log(result);    // 打印服务端返回的数据(调试用)

                             if (result == 11) {

                                 alert("SUCCESS");

                                 window.location.href='GetListServlet';

                                 return;

                             };

                             alert("失败了");

                         },

                         error : function() {

                             alert("异常！");

                         }

                     });

                 }else{

                     alert("代码已标注不可用");

                 }

             }else{

                 return false;

             }

          };

     });

 </script>

添加信息页面 JavaScript 验证（ 比较多，写在<head>标签中 ）

4.2、工程架构实现

4.2.1　创建Web project 工程

注：Context root URL 一般情况下与工程名相同，不建议修改

4.2.2　创建主包

4.2.3　创建主包下的子包 dao、entity、service、servlet

4.2.4　在 WebRoot 文件夹下创建 jsp 页面，将写好的页面写入 jsp 文件中

4.2.5　示例图：

4.3、具体细节实现

4.3.1　dao

编写数据库连接类，financingproduct 数据库操作的相关方法集合类

4.3.2　entity

编写实体类

4.3.3　service

    /**

     * 查询方法

     * 调用 Dao 类

     * 根据输入的 财品 id 判断该 id 是否已经存在

     */

    public boolean checkAjaxInfo(String poctionId){

        return new FinancingProductDao().checkAjaxInfo(poctionId);

    }

FinancingProductDao 示例代码

4.3.4　servlet

页面转至 控制层 处理数据返回结果信息

        request.setCharacterEncoding("utf-8");

        response.setCharacterEncoding("utf-8");

        String productId=request.getParameter("productId");

        productId = new String(productId.getBytes("iso-8859-1"),"gb2312");

        if(!new FinancingProductService().checkAjaxInfo(productId)){

            // 可用

            response.getWriter().println("代码可用");

        }else{

            // 不可用

            response.getWriter().println("代码不可用");

        }

CheckServlet 示例代码

4.3.5　Tomcat 7.x

( 1 ) 在 Manage Deployments 中部署项目

( 2 ) 在 Servers 选项卡中，启动 Tomcat 7.x

( 3 ) 在浏览中访问项目，地址：http://localhost:8080/FinancingProductSys/

五、项目功能实现

5.1、模糊查询  SQL 语句

        request.setCharacterEncoding("utf-8");

        String id = request.getParameter("productId");

        String fx = request.getParameter("productFx");

//        System.out.println(id+"****"+fx);

        if(id==null && fx==null){

            // 查询全部信息

            // 初始值

            ArrayList<FinancingProduct> fdata = new ArrayList<FinancingProduct>();

            fdata = new FinancingProductService().getInfo();

            request.setAttribute("fdata", fdata);

            request.getRequestDispatcher("index.jsp").forward(request,response);

        }else if (id.equals("") && fx==null){

            // 查询全部信息

            // 产品为空且风险级别为空

            ArrayList<FinancingProduct> fdata = new ArrayList<FinancingProduct>();

            fdata = new FinancingProductService().getInfo();

            request.setAttribute("fdata", fdata);

            request.getRequestDispatcher("index.jsp").forward(request,response);

        }else if(!id.equals("") && fx==null){

            // 查询全部信息

            // 仅有产品代码

            fx="";

            ArrayList<FinancingProduct> fdata = new ArrayList<FinancingProduct>();

            fdata = new FinancingProductService().getInfo(id,fx);

            request.setAttribute("fdata", fdata);

            request.getRequestDispatcher("index.jsp").forward(request,response);

        }else{

            // 查询部分信息

            ArrayList<FinancingProduct> fdata = new ArrayList<FinancingProduct>();

            fdata = new FinancingProductService().getInfo(id,fx);

            request.setAttribute("fdata", fdata);

            request.getRequestDispatcher("index.jsp").forward(request,response);

        }

GetListServlet 示例代码

5.2、隔行添加表格底色

创建一个 css 样式，在 <c:forEach>中利用 varStatus="status"  属性。在 <c:if> 判断当前为第几条信息，如可被 1 余 0，给其添加样式。（ 代码见上 查询页面主页面 ）

5.2、添加新信息页面数据校验

详情代码见上（ 添加新信息的添加页面 ）

        request.setCharacterEncoding("utf-8");

        String productId = request.getParameter("productId");

        String productFxx = request.getParameter("productFx");

        int fx = Integer.parseInt(productFxx);

        String productSy = request.getParameter("productSy");

        String productSt = request.getParameter("productSt");

        String productEn = request.getParameter("productEn");

        String productDq = request.getParameter("productDq");

        FinancingProduct fp = new FinancingProduct();

        fp.setId(productId);

        fp.setRisk(fx);

        fp.setIncome(productSy);

        fp.setSaleStarting(productSt);

        fp.setSaleEnd(productEn);

        fp.setEnd(productDq);

        int n = -1 ;

        n = new FinancingProductService().addNewInfo(fp);

//        System.out.println(n);

        if(n>0){

            response.getWriter().println("11");

        }else{

            response.getWriter().println("00");

        }

AddServlet 示例代码

六、总结

当你的能力满足不了你的野心的时候，就该静下心下好好学习。

人生中的一切改变都是，日常一点一点积累起来的

JSP+Servlet 实现：理财产品信息管理系统的更多相关文章

  1. 基于JSP+Servlet的学生信息管理系统

    JavaWeb期末项目,一个基于JSP和Servlet的学生信息管理系统实现,前端用了bootstrap和一些自定义的css样式,数据库用了mysql 传送门: GitHub 实现功能 登录(教师, ...

  2. 基于JSP+Servlet开发高校社团管理系统（前台+后台） 源码

    基于JSP+Servlet开发高校社团管理系统(前台+后台): 开发环境:    Windows操作系统 开发工具:Eclipse/MyEclipse+Jdk+Tomcat+MYSQL数据库 运行效果 ...

  3. 基于jsp+servlet图书管理系统之后台用户信息删除操作

    上一篇的博客写的是修改操作,且附有源码和数据库,这篇博客写的是删除操作,附有从头至尾写的代码(详细的注释)和数据库! 此次删除操作的源码和数据库:http://download.csdn.net/de ...

  4. 基于jsp+servlet图书管理系统之后台用户信息查询操作

    上一篇的博客写的是插入操作,且附有源码和数据库,这篇博客写的是查询操作,附有从头至尾写的代码(详细的注释)和数据库! 此次查询操作的源码和数据库:http://download.csdn.net/de ...

  5. 基于jsp+servlet图书管理系统之后台用户信息修改操作

    上一篇的博客写的是查询操作,且附有源码和数据库,这篇博客写的是修改操作,附有从头至尾写的代码(详细的注释)和数据库! 此次修改操作的源码和数据库:http://download.csdn.net/de ...

  6. 基于jsp+servlet图书管理系统之后台用户信息插入操作

    前奏: 刚开始接触博客园写博客,就是写写平时学的基础知识,慢慢发现大神写的博客思路很清晰,知识很丰富,非常又价值,反思自己写的,顿时感觉非常low,有相当长一段时间没有分享自己的知识.于是静下心来钻研 ...

  7. 从零开始，编写简单的课程信息管理系统（使用jsp+servlet+javabean架构）

    一.相关的软件下载和环境配置 1.下载并配置JDK. 2.下载eclipse. 3.下载并配置apache-tomcat(服务器). 4.下载MySQL(数据库). 5.下载Navicat for M ...

  8. [项目分享]JSP+Servlet+JDBC实现的学生信息管理系统

    本文存在视频版本,请知悉 项目简介 项目来源于:https://gitee.com/liu_xu111/JavaWeb01 这次分享一个学生管理系统,我感觉这是程序员在大学时期的毕设和课程设计选择最多 ...

  9. 基于jsp+servlet图书管理系统之后台万能模板

    前奏: 刚开始接触博客园写博客,就是写写平时学的基础知识,慢慢发现大神写的博客思路很清晰,知识很丰富,非常又价值,反思自己写的,顿时感觉非常low,有相当长一段时间没有分享自己的知识.于是静下心来钻研 ...

随机推荐

  1. 对于 TCP 三次握手的理解

    假设名叫 A 和 B 的两个人要进行通信,那么他们两人之间,首先要确保通信顺畅. 而确保通信顺畅,就要从 3 个维度,确定 8 个能力 3 个维度分别是: 1.人知道(A 知道.B 知道) 2.人(A ...

  2. [LC]26题 Remove Duplicates from Sorted Array （删除排序数组中的重复项）（双指针法）（原地实现）

    ①中文题目 给定一个排序数组,你需要在原地删除重复出现的元素,使得每个元素只出现一次,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成 ...

  3. 小白学 Python 爬虫（3）：前置准备（二）Linux基础入门

    人生苦短,我用 Python 前文传送门: 小白学 Python 爬虫(1):开篇 小白学 Python 爬虫(2):前置准备(一)基本类库的安装 Linux 基础 CentOS 官网: https: ...

  4. .NET Core 3.0中用 Code-First 方式创建 gRPC 服务与客户端

    .NET Core love gRPC 千呼万唤的 .NET Core 3.0 终于在 9 月份正式发布,在它的众多新特性中,除了性能得到了大大提高,比较受关注的应该是 ASP.NET Core 3. ...

  5. add jar and proxy repo

    1. 添加代理仓库 2. 添加host 仓库 3. 添加私有jar 4. 添加仓库到public 仓库

  6. IDEA最常用快捷键汇总+快速写出Main函数

    IDEA可以说是当下Java程序员日常开发的神器,但是想要发挥这款神器的牛逼威力,必须得熟练使用它的各种快捷键才行.本篇总结下使用IDEA(也就是IntelliJ IDEA )进行日常开发中最常用的快 ...

  7. alpha week 2/2 Scrum立会报告+燃尽图 01

    此作业要求参见https://edu.cnblogs.com/campus/nenu/2019fall/homework/9798 一.小组情况 队名:扛把子 组长:迟俊文 组员:宋晓丽 梁梦瑶 韩昊 ...

  8. HDFS之DataNode

    DataNode工作机制 1)一个数据块在datanode上以文件形式存储在磁盘上,包括两个文件,一个是数据本身,一个是元数据包括数据块的长度,块数据的校验和,以及时间戳. 2)DataNode启动后 ...

  9. LVM扩容之xfs文件系统

    LVM的基础请见:https://www.cnblogs.com/wxxjianchi/p/9698089.html 一.放大LV的容量.放大容量是由内而外来操作的. 1.设置新的lvm分区:用fdi ...

  10. PHP基于Redis实现轻量级延迟队列

    延迟队列,顾名思义它是一种带有延迟功能的消息队列. 那么,是在什么场景下我才需要这样的队列呢? 一.背景 先看看一下业务场景: 1.会员过期前3天发送召回通知 2.订单支付成功后,5分钟后检测下游环节 ...