继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

客户关系管理系统(3)

Java3y
关注TA
已关注
手记 297
粉丝 1.5万
获赞 6488

为了做到更好的通用性,处理分页数据的url应该由Servlet传进去给Page类,让Page类封装起来!要使用的时候,再用Page取出来就行了。

下面写法已经固定了,不够灵活!也就是说,下面的url地址不应该写死的


    ${pageContext.request.contextPath}/LookCustomer?currentPageCount=${page.currentPageCount+1}

我们可以这样做:

  • 在Controller上获取Servlet的名称,在传递用户想要看的页数的同时,把Servlet的url也传递进去

        String servletName = this.getServletName();

        //调用BusinessService的方法,获取得到所有客户信息
        BusinessService businessService = new BusinessService();

        //把Servlet的url也传递进去
        Page page = businessService.getPageData2(currentPageCount, request.getContextPath() + "/" + servletName);
  • 在Page类上,多增加一个成员变量

    private String url;
    public String getUrl() {
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }
  • 在BusinessService接受到web层传递进来的url,set到Page对象上就行了!

    page.setUrl(url);

我们在jsp页面跳转到处理分页数据的Servlet上,就再不用写死了。直接用Page对象中获取出来就行了!


    <%--把传递过去的页码-1就行了--%>
    <a href="${page.url}?currentPageCount=${page.currentPageCount-1}">
        上一步
    </a>

开发web的删除和修改

在查询jsp页面上,增添删除和修改的操作链接!


开发处理删除操作的Servlet

超链接绑定要删除用户的id,带过去给Controller

        <a href="${pageContext.request.contextPath}/DeleteCustomer?id=${customer.id}">删除</a>

controller的代码也十分简单:


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

        //调用BusinessService层的功能,就可以完成删除操作了
        BusinessService businessService = new BusinessService();

        businessService.deleteCustomer(id);

删除客户记录也是一件非常重要的事情,应该提供JavaSrcript代码询问是否要真的删除

在超链接控件上绑定事件!


       <a href="${pageContext.request.contextPath}/DeleteCustomer?id=${customer.id}" onclick=" return sureDelete()">删除</a>

    function sureDelete() {
        var b = window.confirm("你确定要删除吗?");

        if(b) {
            return true;
        }else {
            return false;
        }
    }

测试:


修改操作

修改操作的流程是这样的:点击修改超链接,跳转到该用户的详细信息页面,在详细信息页面中修改数据,再提交修改!【跳转到用户详细信息页面时,用户的id还在的,在提交数据的时候,记得把id也给到服务器,【id是不包含在表单中的,要我们自己提交过去】!】


   <a href="${pageContext.request.contextPath}/UpdateCustomerUI?=${customer.id}">修改</a>

开发提供用户详细信息的Servlet


        String id = request.getParameter("id");
        BusinessService businessService = new BusinessService();

        //通过id获取得到用户的详细信息
        Customer customer = businessService.findCustomer(id);

        request.setAttribute("customer", customer);
        //跳转到显示用户详细信息的jsp页面上
        request.getRequestDispatcher("/WEB-INF/customerInformation").forward(request, response);

开发显示用户信息的JSP【数据回显】

想要日期能够选择,记得导入JavaScript代码,响应事件!

注意:在显示页面上,一定要把id传递过去给处理表单的Servlet,不然服务器是不知道你要修改哪一条数据的!

<head>
    <title>用户详细信息</title>
    <script type="text/javascript" src="${pageContext.request.contextPath}/customer.js">

    </script>
</head>
<body onload="pageInit()">

<form action="${pageContext.request.contextPath}/updateCustomer?id=${customer.id}" method="post" onsubmit="makeForm()">
    <table border="1px">
        <tr>
            <td>用户名:</td>
            <td><input type="text" name="name" value="${customer.name}"></td>
        </tr>

        <tr>
            <td>性别</td>
            <td><input type="radio" name="gender" value="male" ${customer.gender=='male'?'checked':''}>男
            <input type="radio" name="gender" value="female"${customer.gender=='female'?'checked':''}>女
            </td>
        </tr>
        <tr>
            <td>生日</td>
            <td>
                <select id="year">
                    <option value="${fn:split(customer.birthday,'-')[0]}">${fn:split(customer.birthday,'-')[0]}</option>
                </select>
                <select id="month">
                    <option value="${fn:split(customer.birthday,'-')[1]}">${fn:split(customer.birthday,'-')[1]}</option>
                </select>
                <select id="day">
                    <option value="${fn:split(customer.birthday,'-')[2]}">${fn:split(customer.birthday,'-')[2]}</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>电话号码:</td>
            <td><input type="text" name="cellphone" value="${customer.cellphone}"></td>
        </tr>
        <tr>
            <td>邮箱:</td>
            <td><input type="text" name="email"value="${customer.email}"></td>
        </tr>
        <tr>
            <td>爱好:</td>
            <td>
                <input type="checkbox" name="hobbies" value="唱歌"${fn:contains(customer.preference, '唱歌')==true?'checked':''}>唱歌

                <input type="checkbox" name="hobbies" value="跳舞"${fn:contains(customer.preference, '跳舞')==true?'checked':''}>跳舞
                <input type="checkbox" name="hobbies" value="打代码"${fn:contains(customer.preference, '打代码')==true?'checked':''}>打代码
            </td>
        </tr>
        <tr>
            <td>客户类型</td>
            <td>
                <input type="radio" name="type" value="VIP" ${customer.type=='VIP'?'checked':''}>VIP
                <input type="radio" name="type" value="普通客户"${customer.type=='普通客户'?'checked':''}>普通客户
                <input type="radio" name="type" value="黑名单客户"${customer.type=='黑名单客户'?'checked':''}>黑名单客户
            </td>
        </tr>
        <tr>
            <td>描述</td>
            <td>
                <textarea name="description" cols="30" rows="10">${customer.description}</textarea>
            </td>
        </tr>
        <tr>
            <td><input type="submit" value="确定修改"></td>
            <td><input type="reset" value="重置"></td>
        </tr>
    </table>
</form>

效果:

处理修改表单数据的Servlet


        //将数据封装到Bean中
        Customer customer = WebUtils.request2Bean(request, Customer.class);

        //将id封装到Customer对象中!!!不要忘了id!!!在表单中获取到的数据是没有id的!!!!!记得!!!!
        customer.setId(request.getParameter("id"));

        //调用Service层的方法,实现修改
        BusinessService businessService = new BusinessService();
        businessService.updateCustomer(customer);

        //修改成功就跳回查看客户界面
        request.getRequestDispatcher("/LookCustomer").forward(request, response);
  • 效果:

总结
  1. 在dao层中,我们有添加客户、通过id查找用户、删除用户、修改用户信息的方法。
  2. 日期我们一般用下拉框来给用户选取,要想下拉框的信息有足够多的数据,我们需要用到JavaScript【DOM编程动态增加和修改数据】
  3. javasrcipt文件不能放在WEB-INF目录下面
  4. 日期的数据通过下拉框选取,年、月、日是分散的,我们需要把他们拼接,于是我们也用JavaScript来拼接【减低服务器端的压力】
  5. 开发工具方法request2Bean,主要用到了BeanUtils框架,这样就不用在Servlet一个一个封装了。
  6. 在JSP判断集合是否有元素时,我们可以用EL表达式${empty(集合)}
  7. 如果记录数有很多,我们应该使用分页技术,一般地,我们使用Page类来封装分页的数据
  8. 要使用分页技术,就必须在数据库用查询总记录数,通过总记录数,就可以算出总页数了【每页显示多少条记录由我们说了算】
  9. 在dao层还要编写获取具体的分页数据,从哪里开始,哪里结束,返回一个List集合,再把List集合封装到Page对象上
  10. 由于获取分页数据需要当前的页数是多少,(所以在service中要判断当前页数是否存在,如果不存在,那么就设置为1)【更新,我认为在Controller判断会好一点】
  11. 分页中,我们还支持上一页和下一页的功能,如果页数大于1,才显示上一页,如果页数小于1,才显示下一页。
  12. 给出下拉框进行页数跳转,使用JavaScript事件机制,获取页数,再提交给Servlet处理即可
  13. 我们还要控制页数的显示,因为不可能有100页,我们就显示100页,这样是不可能的。在Page类中维护两个变量,startPage,endPage。我们规定每次只能显示10页数据,如果第一次访问就显示1-10页。如果当前页数大于10,那么就显示6-15页。如果角标越界了,那么就显示前10页或者后10页
  14. 我们把显示分页的页面封装成单独的jsp,使用的Servlet连接也可以用url变量来维护。
  15. 前台数据做拼接,最终都是把拼接好的数据用一个隐藏域封装起来,随后让form表单一起提交

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP