6.2 页面设计及代码实现
1.Login.html
该页面提供了用户登录的表单,输入用户名和密码后提交到Login Management.jsp进行登录验证,此外页面还提供了到注册界面Register.html的超链接。代码如下。
运行结果如图6-3所示。
图6-3 登录界面
2.Register.html
该页面用于会员注册,提示用户输入个人信息,提交后会转到MemInfo Management.jsp进行注册。代码如下。
运行结果如图6-4所示。
图6-4 注册界面
3.Login Management.jsp
该页面实现会员登录处理,包括登录验证和退出登录的处理。登录验证需要从登录表单获取用户名和密码,若用户名或密码为空则重定向至登录页面,否则调用JavaBean组件Member.java访问数据表Memberinfo,判断用户名和密码是否有效,若有效则跳转至图书浏览页面,否则输出错误提示并转向登录页面。退出登录则清空session对象并转向登录页面。代码如下。
当用户注册成功后显示如图6-5所示的欢迎页面,若退出登录则给出如图6-6所示的提示信息。
图6-5 注册成功显示欢迎页面
图6-6 退出登录显示提示信息
4.BestBook.jsp
该页面用于显示图书列表供会员浏览,调用了JavaBean组件Book.java访问数据表bookinfo。点击图书链接,会进入Bookdetail.jsp显示图书详情。此外界面左侧为导航栏,提供到修改会员信息和密码的Update MemInfoForm.jsp、购物车页面Bookcart.jsp、查看订单页面Order Management.jsp以及退出登录页面Login Management.jsp的超链接。
运行结果如图6-7所示。
图6-7 图书浏览界面
5.Bookdetail.jsp
在图书浏览页面点击指向某本图书的超链接后,将转向图书详情页面。根据传入的图书ISBN号,调用JavaBean组件Book.java访问数据库,提取图书的详细信息并显示出来。此外,本页面还提供了加入购物车的表单,选择购买数量点击按钮后,将由CartInfo Management.jsp页面处理表单数据。代码如下。
界面显示效果如图6-8所示。
6.Bookcart.jsp
该页面用于读取并显示存储在session对象中的购物车内容,其中调用了JavaBean组件Cart.java和CartItem.java。页面还提供了可以修改图书数量、删除图书以及清空购物车的表单,点击相应按钮后由CartInfo Management.jsp页面处理。在显示购物车中的图书信息时,需调用JavaBean组件Book.java。确定购买后,可以提交订单,进入Order Form.jsp页面填写收货人信息。代码如下。
图6-8 图书详情界面
运行结果如图6-9所示。
图6-9 查看购物车界面
7.CartInfo Management.jsp
该页面调用了JavaBean组件Cart.java和CartItem.java实现购物车的操作,包括将图书添加到购物车、修改图书数量、删除购物项、清空购物车。操作完成后,转发至BestBook.jsp页面。代码如下。
8.OrderForm.jsp
本页面用于当在购物车页面点击提交订单时,显示填写收件信息的表单。代码如下。
运行结果如图6-10所示。
图6-10 订单收件信息填写界面
9.Order Management.jsp
该页面用于实现创建订单、查看订单的功能。提交订单并确认收件人信息后,本页面将调用JavaBean组件Order.java、Cart.java、CartItem.java和Book.java生成订单编号,并将订单信息写入数据库。此外,本页面还创建了记录上次下单时间的Cookie。代码如下。
当用户首次下单时显示如图6-11所示的订单信息页面,再次下单时则显示如图6-12所示的页面,其中包含了上次下单时间的Cookie。当用户查看订单时,则显示如图6-13所示的订单列表信息。
图6-11 首次下单显示订单页面
图6-12 再次下单显示包含Cookie的订单页面
图6-13 查看往期订单信息的页面
10.UpdateMemInfoForm.jsp
该页面提供了修改密码和修改个人信息的表单。代码如下。
修改密码和修改个人信息的页面运行结果分别如图6-14和图6-15所示。
图6-14 修改密码页面
图6-15 修改个人信息页面
11.MemInfo Management.jsp
本页面调用JavaBean组件Member.java实现会员注册、个人信息和密码的修改。注册时,若用户名已被使用会显示提示信息并跳转至注册页面,注册成功则跳转至登录页面。修改密码时,如果原密码输错或两次新密码输入不一致均显示相应的提示信息。修改成功则进入图书浏览页面。代码如下。
JavaBean组件的代码实现请扫二维码。
JavaBean组件的代码实现