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

前奏:

  刚开始接触博客园写博客,就是写写平时学的基础知识,慢慢发现大神写的博客思路很清晰,知识很丰富,非常又价值,反思自己写的,顿时感觉非常low,有相当长一段时间没有分享自己的知识。于是静下心来钻研知识,趁着这学期的结束(马上就要放寒假了),写写最近练习的基于jsp+servlet+前台模板写的图书管理系统,一点一点写吧,详细的注释已经在代码上说明,希望对学习基于java开发的web方向的童鞋有所帮助。今天先把写的用户信息管理的添加(插入)操作分享一下,使用了一些特殊的知识,也会做一下说明。更多代码和功能会持续更新,完整可直接运行的。

  开发环境:Eclipse Version: Mars.2 Release (4.5.2) 

         JDK Version:1.8

       tomcat  Vsersion:7.0

详细的代码和数据库设计在这里下载即可:http://download.csdn.net/detail/biexiansheng/9728492

  (由于个人掌握知识有限,如若有不足的地方,还请多多交流。)

开始修改原型设计:

  1:设计好数据库(当然我这里设计是简单的数据库),见上面的链接,下载导入自己的数据库即可使用。

  2:我先准备好了原型模板,然后将原型模板修改好,然后才进行开发。原型模板修改如下。

    将登录界面的原型html修改为jsp

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <%
 4     //获取绝对路径路径 
 5     String path = request.getContextPath();
 6     String basePath = request.getScheme() + "://"
 7                 + request.getServerName() + ":" + request.getServerPort()
 8                 + path + "/";
 9 %> 
10 <!DOCTYPE html>
11 <html lang="en">
12 <head>
13 <base href="<%=basePath %>" />
14 <title>用户登录</title>
15 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
16 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
17 <link href="resource/assets/css/bootstrap.min.css" rel="stylesheet" />
18 <link rel="stylesheet" href="resource/assets/css/font-awesome.min.css" />
19 <link rel="stylesheet" href="resource/assets/css/ace.min.css" />
20 <link rel="stylesheet" href="resource/assets/css/ace-rtl.min.css" />
21 </head>
22 <body class="login-layout">
23     <div class="main-container">
24         <div class="main-content">
25             <div class="row">
26                 <div class="col-sm-10 col-sm-offset-1">
27                     <div class="login-container">
28                         <div class="center">
29                             <h1>
30                                 <i class="icon-leaf green"></i> <span class="red">别先生</span> <span
31                                     class="white">图书管理系统</span>
32                             </h1>
33                             <h4 class="blue"></h4>
34                         </div>
35                         <div class="space-6"></div>
36                         <div class="position-relative">
37                             <div id="login-box"
38                                 class="login-box visible widget-box no-border">
39                                 <div class="widget-body">
40                                     <div class="widget-main">
41                                         <h4 class="header blue lighter bigger">
42                                             <i class="icon-coffee green"></i> 请输入您的账号和密码
43                                         </h4>
44 
45                                         <div class="space-6"></div>
46                                         <form action="view/system/main/index.jsp" method="post" onsubmit="return check()">
47                                             <fieldset>
48                                                 <label class="block clearfix"> <span
49                                                     class="block input-icon input-icon-right"> <input id="userId"
50                                                         name="userId" type="text" class="form-control"
51                                                         placeholder="请输入您的账号" /> <i class="icon-user"></i>
52                                                 </span>
53                                                 </label> <label class="block clearfix"> <span
54                                                     class="block input-icon input-icon-right"> <input id="userPw"
55                                                         name="passWord" type="password" class="form-control"
56                                                         placeholder="请输入您的密码" /> <i class="icon-lock"></i>
57                                                 </span>
58                                                 </label>
59 
60                                                 <div class="clearfix">
61                                             
62 
63                                                     <button type="submit"
64                                                         class="width-35 pull-right btn btn-sm btn-primary">
65                                                         <i class="icon-key"></i> 登陆
66                                                     </button>
67                                                 </div>
68 
69                                                 <div class="space-4"></div>
70                                             </fieldset>
71                                         </form>
72 
73                                     </div>
74 
75                                 </div>
76 
77                             </div>
78 
79 
80                     </div>
81 
82                 </div>
83             </div>
84 
85         </div>
86 </div>
87     </div>
88 
89 </body>
90 </html>

将主界面的原型html修改为jsp

  1 <%@ page language="java" contentType="text/html; charset=UTF-8"
  2     pageEncoding="UTF-8"%>
  3 <%
  4     //获取绝对路径路径 
  5     String path = request.getContextPath();
  6     String basePath = request.getScheme() + "://"
  7                 + request.getServerName() + ":" + request.getServerPort()
  8                 + path + "/";
  9 %> 
 10 <!DOCTYPE html>
 11 <html lang="en">
 12 <head>
 13 <base href="<%=basePath %>" />
 14 <title>首页</title>
 15 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 16 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 17 <link href="resource/assets/css/bootstrap.min.css" rel="stylesheet" />
 18 <link rel="stylesheet" href="resource/assets/css/font-awesome.min.css" />
 19 <link rel="stylesheet" href="resource/assets/css/ace.min.css" />
 20 <link rel="stylesheet" href="resource/assets/css/ace-rtl.min.css" />
 21 <link rel="stylesheet" href="resource/assets/css/ace-skins.min.css" />
 22 <script src="resource/assets/js/ace-extra.min.js"></script>
 23 <script src="resource/assets/jquery.min.js"></script>
 24 </head>
 25 <body>
 26 <div class="navbar navbar-default" id="navbar">
 27         <script type="text/javascript">
 28             try {
 29                 ace.settings.check('navbar', 'fixed')
 30             } catch (e) {
 31             }
 32         </script>
 33 
 34         <div class="navbar-container" id="navbar-container">
 35             <div class="navbar-header pull-left">
 36                 <a href="view/system/main/index.jsp" class="navbar-brand"> <small> <i
 37                         class="icon-leaf"></i> 别先生后台图书管理系统
 38                 </small>
 39                 </a>
 40                 <!-- /.brand -->
 41             </div>
 42             <!-- /.navbar-header -->
 43 
 44             <div class="navbar-header pull-right" role="navigation">
 45                 <ul class="nav ace-nav">
 46                     <li class="green"><a data-toggle="dropdown"
 47                         class="dropdown-toggle" href="#"> <i
 48                             class="icon-envelope icon-animated-vertical"></i> <span
 49                             class="badge badge-success">5</span>
 50                     </a>
 51 
 52                         <ul
 53                             class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
 54                             <li class="dropdown-header"><i class="icon-envelope-alt"></i>
 55                                 5条消息</li>
 56                         </ul></li>
 57 
 58                     <li class="light-blue"><a data-toggle="dropdown" href="#"
 59                         class="dropdown-toggle"> <img class="nav-user-photo"
 60                             src="resource/assets/avatars/user.jpg" alt="Jason's Photo" /> <span
 61                             class="user-info"> <small>欢迎光临,</small>
 62                         </span> <i class="icon-caret-down"></i>
 63                     </a>
 64                         <ul
 65                             class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
 66                             
 67                             <li><a href="#"  target="mainframe"> <i class="icon-user"></i> 个人资料
 68                             </a></li>
 69 
 70                             <li class="divider"></li>
 71 
 72                             <li><a href="view/system/main/login.jsp"> <i class="icon-off"></i> 退出
 73                             </a></li>
 74                         </ul></li>
 75                 </ul>
 76                 <!-- /.ace-nav -->
 77 
 78             </div>
 79             <!-- /.navbar-header -->
 80         </div>
 81         <!-- /.container -->
 82     </div>
 83 
 84     <div class="main-container" id="main-container">
 85         <script type="text/javascript">
 86             try {
 87                 ace.settings.check('main-container', 'fixed')
 88             } catch (e) {
 89             }
 90         </script>
 91 
 92         <div class="main-container-inner">
 93             <a class="menu-toggler" id="menu-toggler" href="#"> <span
 94                 class="menu-text"></span>
 95             </a>
 96 
 97             <div class="sidebar" id="sidebar">
 98                 <script type="text/javascript">
 99                     try {
100                         ace.settings.check('sidebar', 'fixed')
101                     } catch (e) {
102                     }
103                 </script>
104 
105                 <div class="sidebar-shortcuts" id="sidebar-shortcuts">
106                     <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
107                         <button class="btn btn-success">
108                             <i class="icon-signal"></i>
109                         </button>
110 
111                         <button class="btn btn-info">
112                             <i class="icon-pencil"></i>
113                         </button>
114 
115                         <button class="btn btn-warning">
116                             <i class="icon-group"></i>
117                         </button>
118 
119                         <button class="btn btn-danger">
120                             <i class="icon-cogs"></i>
121                         </button>
122                     </div>
123 
124                     <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
125                         <span class="btn btn-success"></span> <span class="btn btn-info"></span>
126 
127                         <span class="btn btn-warning"></span> <span class="btn btn-danger"></span>
128                     </div>
129                 </div>
130                 <!-- #sidebar-shortcuts -->
131 
132                 <ul class="nav nav-list">
133                     <li class="active"><a
134                         href="view/system/main/main.jsp" target="mainframe">
135                             <i class="icon-dashboard"></i> <span class="menu-text">
136                                 控制台 </span>
137                     </a></li>
138                 <li><a href="javascript:void(0)" target="mainframe"
139                         class="dropdown-toggle"> <i class="icon-desktop"></i> <span
140                             class="menu-text"> 系统管理 </span> <b class="arrow icon-angle-down"></b>
141                     </a>
142 
143                         <ul class="submenu">
144                             
145                             <li><a href="view/system/userinfo/userinfo_list.jsp" target="mainframe"> <i
146                                     class="icon-double-angle-right"></i> 用户管理
147                             </a></li>
148                 
149                         </ul>
150                 </li>
151                         <li><a href="javascript:void(0)" target="mainframe"
152                         class="dropdown-toggle"> <i class="icon-desktop"></i> <span
153                             class="menu-text">图书管理 </span> <b class="arrow icon-angle-down"></b>
154                     </a>
155 
156                         <ul class="submenu">
157                             
158                             <li><a href="view/crm/customer/customer_list.html" target="mainframe"> <i
159                                     class="icon-double-angle-right"></i> 图书管理
160                             </a></li>
161                                <li><a href="view/crm/customer/customer_list.html" target="mainframe"> <i
162                                     class="icon-double-angle-right"></i> 图书记录管理
163                             </a></li>
164                         
165                         </ul>
166                 </li>
167                 </ul>
168                 <!-- /.nav-list -->
169 
170                 <div class="sidebar-collapse" id="sidebar-collapse">
171                     <i class="icon-double-angle-left"
172                         data-icon1="icon-double-angle-left"
173                         data-icon2="icon-double-angle-right"></i>
174                 </div>
175 
176                 <script type="text/javascript">
177                     try {
178                         ace.settings.check('sidebar', 'collapsed')
179                     } catch (e) {
180                     }
181                 </script>
182             </div>
183 
184             <div class="main-content" id="mains">
185                 <iframe id="mainframe" name="mainframe" src="view/system/main/main.jsp"
186                     style="width: 100%;border: 0px;"> </iframe>
187 
188             </div>
189 
190             <script type="text/javascript">
191                 var height = jQuery(window).height() - 50;
192                 jQuery("#mainframe").attr("height", "" + height + "px;");
193             </script>
194 
195             <div class="ace-settings-container" id="ace-settings-container">
196                 <div class="btn btn-app btn-xs btn-warning ace-settings-btn"
197                     id="ace-settings-btn">
198                     <i class="icon-cog bigger-150"></i>
199                 </div>
200 
201                 <div class="ace-settings-box" id="ace-settings-box">
202                     <div>
203                         <div class="pull-left">
204                             <select id="skin-colorpicker" class="hide">
205                                 <option data-skin="default" value="#438EB9">#438EB9</option>
206                                 <option data-skin="skin-1" value="#222A2D">#222A2D</option>
207                                 <option data-skin="skin-2" value="#C6487E">#C6487E</option>
208                                 <option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
209                             </select>
210                         </div>
211                         <span>&nbsp; 选择皮肤</span>
212                     </div>
213 
214                     <div>
215                         <input type="checkbox" class="ace ace-checkbox-2"
216                             id="ace-settings-navbar" /> <label class="lbl"
217                             for="ace-settings-navbar"> 固定导航条</label>
218                     </div>
219 
220                     <div>
221                         <input type="checkbox" class="ace ace-checkbox-2"
222                             id="ace-settings-sidebar" /> <label class="lbl"
223                             for="ace-settings-sidebar"> 固定滑动条</label>
224                     </div>
225 
226                     <div>
227                         <input type="checkbox" class="ace ace-checkbox-2"
228                             id="ace-settings-breadcrumbs" /> <label class="lbl"
229                             for="ace-settings-breadcrumbs">固定面包屑</label>
230                     </div>
231 
232                     <div>
233                         <input type="checkbox" class="ace ace-checkbox-2"
234                             id="ace-settings-rtl" /> <label class="lbl"
235                             for="ace-settings-rtl">切换到左边</label>
236                     </div>
237 
238                     <div>
239                         <input type="checkbox" class="ace ace-checkbox-2"
240                             id="ace-settings-add-container" /> <label class="lbl"
241                             for="ace-settings-add-container"> 切换窄屏 <b></b>
242                         </label>
243                     </div>
244                 </div>
245             </div>
246             <!-- /#ace-settings-container -->
247         </div>
248         <!-- /.main-container-inner -->
249 
250         <a href="#" id="btn-scroll-up"
251             class="btn-scroll-up btn btn-sm btn-inverse"> <i
252             class="icon-double-angle-up icon-only bigger-110"></i>
253         </a>
254     </div>
255     <!-- /.main-container -->
256     <!-- basic scripts -->
257 
258 
259 
260 
261     <script type="text/javascript">
262         if ("ontouchend" in document)
263             document
264                     .write("<script src='resource/assets/js/jquery.mobile.custom.min.js'>"
265                             + "<"+"script>");
266     </script>
267     <script src="resource/assets/js/bootstrap.min.js"></script>
268     <script src="resource/assets/js/typeahead-bs2.min.js"></script>
269 
270     <!-- page specific plugin scripts -->
271 
272     <!--[if lte IE 8]>
273           <script src="resource/assets/js/excanvas.min.js"></script>
274         <![endif]-->
275 
276     <script src="resource/assets/js/jquery-ui-1.10.3.custom.min.js"></script>
277     <script src="resource/assets/js/jquery.ui.touch-punch.min.js"></script>
278     <script src="resource/assets/js/jquery.slimscroll.min.js"></script>
279     <script src="resource/assets/js/jquery.easy-pie-chart.min.js"></script>
280     <script src="resource/assets/js/jquery.sparkline.min.js"></script>
281     <script src="resource/assets/js/flot/jquery.flot.min.js"></script>
282     <script src="resource/assets/js/flot/jquery.flot.pie.min.js"></script>
283     <script src="resource/assets/js/flot/jquery.flot.resize.min.js"></script>
284 
285     <!-- ace scripts -->
286 
287     <script src="resource/assets/js/ace-elements.min.js"></script>
288     <script src="resource/assets/js/ace.min.js"></script>
289 
290     <!-- inline scripts related to this page -->
291 
292     <script type="text/javascript">
293         jQuery(function($) {
294             $('.easy-pie-chart.percentage')
295                     .each(
296                             function() {
297                                 var $box = $(this).closest('.infobox');
298                                 var barColor = $(this).data('color')
299                                         || (!$box.hasClass('infobox-dark') ? $box
300                                                 .css('color')
301                                                 : 'rgba(255,255,255,0.95)');
302                                 var trackColor = barColor == 'rgba(255,255,255,0.95)' ? 'rgba(255,255,255,0.25)'
303                                         : '#E2E2E2';
304                                 var size = parseInt($(this).data('size')) || 50;
305                                 $(this)
306                                         .easyPieChart(
307                                                 {
308                                                     barColor : barColor,
309                                                     trackColor : trackColor,
310                                                     scaleColor : false,
311                                                     lineCap : 'butt',
312                                                     lineWidth : parseInt(size / 10),
313                                                     animate : /msie\s*(8|7|6)/
314                                                             .test(navigator.userAgent
315                                                                     .toLowerCase()) ? false
316                                                             : 1000,
317                                                     size : size
318                                                 });
319                             })
320 
321             $('.sparkline').each(
322                     function() {
323                         var $box = $(this).closest('.infobox');
324                         var barColor = !$box.hasClass('infobox-dark') ? $box
325                                 .css('color') : '#FFF';
326                         $(this).sparkline('html', {
327                             tagValuesAttribute : 'data-values',
328                             type : 'bar',
329                             barColor : barColor,
330                             chartRangeMin : $(this).data('min') || 0
331                         });
332                     });
333 
334             var placeholder = $('#piechart-placeholder').css({
335                 'width' : '90%',
336                 'min-height' : '150px'
337             });
338             var data = [ {
339                 label : "social networks",
340                 data : 38.7,
341                 color : "#68BC31"
342             }, {
343                 label : "search engines",
344                 data : 24.5,
345                 color : "#2091CF"
346             }, {
347                 label : "ad campaigns",
348                 data : 8.2,
349                 color : "#AF4E96"
350             }, {
351                 label : "direct traffic",
352                 data : 18.6,
353                 color : "#DA5430"
354             }, {
355                 label : "other",
356                 data : 10,
357                 color : "#FEE074"
358             } ]
359             function drawPieChart(placeholder, data, position) {
360                 $.plot(placeholder, data, {
361                     series : {
362                         pie : {
363                             show : true,
364                             tilt : 0.8,
365                             highlight : {
366                                 opacity : 0.25
367                             },
368                             stroke : {
369                                 color : '#fff',
370                                 width : 2
371                             },
372                             startAngle : 2
373                         }
374                     },
375                     legend : {
376                         show : true,
377                         position : position || "ne",
378                         labelBoxBorderColor : null,
379                         margin : [ -30, 15 ]
380                     },
381                     grid : {
382                         hoverable : true,
383                         clickable : true
384                     }
385                 })
386             }
387             drawPieChart(placeholder, data);
388 
389             /**
390             we saved the drawing function and the data to redraw with different position later when switching to RTL mode dynamically
391             so that's not needed actually.
392              */
393             placeholder.data('chart', data);
394             placeholder.data('draw', drawPieChart);
395 
396             var $tooltip = $(
397                     "<div class='tooltip top in'><div class='tooltip-inner'></div></div>")
398                     .hide().appendTo('body');
399             var previousPoint = null;
400 
401             placeholder.on('plothover', function(event, pos, item) {
402                 if (item) {
403                     if (previousPoint != item.seriesIndex) {
404                         previousPoint = item.seriesIndex;
405                         var tip = item.series['label'] + " : "
406                                 + item.series['percent'] + '%';
407                         $tooltip.show().children(0).text(tip);
408                     }
409                     $tooltip.css({
410                         top : pos.pageY + 10,
411                         left : pos.pageX + 10
412                     });
413                 } else {
414                     $tooltip.hide();
415                     previousPoint = null;
416                 }
417 
418             });
419 
420             var d1 = [];
421             for (var i = 0; i < Math.PI * 2; i += 0.5) {
422                 d1.push([ i, Math.sin(i) ]);
423             }
424 
425             var d2 = [];
426             for (var i = 0; i < Math.PI * 2; i += 0.5) {
427                 d2.push([ i, Math.cos(i) ]);
428             }
429 
430             var d3 = [];
431             for (var i = 0; i < Math.PI * 2; i += 0.2) {
432                 d3.push([ i, Math.tan(i) ]);
433             }
434 
435             var sales_charts = $('#sales-charts').css({
436                 'width' : '100%',
437                 'height' : '220px'
438             });
439             $.plot("#sales-charts", [ {
440                 label : "Domains",
441                 data : d1
442             }, {
443                 label : "Hosting",
444                 data : d2
445             }, {
446                 label : "Services",
447                 data : d3
448             } ], {
449                 hoverable : true,
450                 shadowSize : 0,
451                 series : {
452                     lines : {
453                         show : true
454                     },
455                     points : {
456                         show : true
457                     }
458                 },
459                 xaxis : {
460                     tickLength : 0
461                 },
462                 yaxis : {
463                     ticks : 10,
464                     min : -2,
465                     max : 2,
466                     tickDecimals : 3
467                 },
468                 grid : {
469                     backgroundColor : {
470                         colors : [ "#fff", "#fff" ]
471                     },
472                     borderWidth : 1,
473                     borderColor : '#555'
474                 }
475             });
476 
477             $('#recent-box [data-rel="tooltip"]').tooltip({
478                 placement : tooltip_placement
479             });
480             function tooltip_placement(context, source) {
481                 var $source = $(source);
482                 var $parent = $source.closest('.tab-content')
483                 var off1 = $parent.offset();
484                 var w1 = $parent.width();
485 
486                 var off2 = $source.offset();
487                 var w2 = $source.width();
488 
489                 if (parseInt(off2.left) < parseInt(off1.left)
490                         + parseInt(w1 / 2))
491                     return 'right';
492                 return 'left';
493             }
494 
495             $('.dialogs,.comments').slimScroll({
496                 height : '300px'
497             });
498 
499             //Android's default browser somehow is confused when tapping on label which will lead to dragging the task
500             //so disable dragging when clicking on label
501             var agent = navigator.userAgent.toLowerCase();
502             if ("ontouchstart" in document && /applewebkit/.test(agent)
503                     && /android/.test(agent))
504                 $('#tasks').on('touchstart', function(e) {
505                     var li = $(e.target).closest('#tasks li');
506                     if (li.length == 0)
507                         return;
508                     var label = li.find('label.inline').get(0);
509                     if (label == e.target || $.contains(label, e.target))
510                         e.stopImmediatePropagation();
511                 });
512 
513             $('#tasks').sortable({
514                 opacity : 0.8,
515                 revert : true,
516                 forceHelperSize : true,
517                 placeholder : 'draggable-placeholder',
518                 forcePlaceholderSize : true,
519                 tolerance : 'pointer',
520                 stop : function(event, ui) {//just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved
521                     $(ui.item).css('z-index', 'auto');
522                 }
523             });
524             $('#tasks').disableSelection();
525             $('#tasks input:checkbox').removeAttr('checked').on('click',
526                     function() {
527                         if (this.checked)
528                             $(this).closest('li').addClass('selected');
529                         else
530                             $(this).closest('li').removeClass('selected');
531                     });
532 
533         })
534     </script>
535 
536 
537 
538 </body>
539 </html>

将其他界面的原型html修改为jsp

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <%
 4     //获取绝对路径路径 
 5     String path = request.getContextPath();
 6     String basePath = request.getScheme() + "://"
 7                 + request.getServerName() + ":" + request.getServerPort()
 8                 + path + "/";
 9 %> 
10 <!DOCTYPE html>
11 <html>
12 <head>
13 <base href="<%=basePath %>" />
14 <meta charset="utf-8">
15 <title>工作台</title>
16 <!-- 新 Bootstrap 核心 CSS 文件 -->
17 <link rel="stylesheet" href="resource/css/bootstrap.min.css">
18 <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
19 <script src="resource/js/jquery.min.js"></script>
20 <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
21 <script src="resource/js/bootstrap.min.js"></script>
22 </head>
23 <body>
24 <div style="padding:0px; margin:0px;">
25  <ul class="breadcrumb" style=" padding:0px; padding-left:20px;" >
26   <li ><a href="#">首页</a></li>
27   <li>工作台</li>
28 </ul>
29 </div>
30 <div class="row">
31     <div class="col-xs-6" >
32          <div class="panel panel-default" >
33           <div class="panel-heading"  >
34             <span class="glyphicon glyphicon-refresh"></span>图形报表
35           </div>
36               <div class="panel-body">
37                   <img src="resource/img/test.png" height="200" width="100%">
38               </div>
39         </div>
40     </div>
41     <div class="col-xs-6" >
42       <div class="panel panel-default" >
43           <div class="panel-heading"  >
44             <span class="glyphicon glyphicon-refresh"></span>图形报表
45           </div>
46               <div class="panel-body">
47                   <img src="resource/img/test.png" height="200" width="100%">
48               </div>
49         </div>
50     </div>
51 
52 
53 </div>
54 
55 
56 </body>
57 </html>

这里插一句,我使用的是servlet3.0,但是配置文件修为了默认访问登录界面login.jsp

1 <?xml version="1.0" encoding="UTF-8"?>
2 <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
3   <display-name>book</display-name>
4   <welcome-file-list>
5       <!-- 默认模仿的是登录界面login.jsp页面 -->
6     <welcome-file>login.jsp</welcome-file>
7   </welcome-file-list>
8 </web-app>

将用户信息列表界面的原型html修改为jsp

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <%
 4     //获取绝对路径路径 
 5     String path = request.getContextPath();
 6     String basePath = request.getScheme() + "://"
 7                 + request.getServerName() + ":" + request.getServerPort()
 8                 + path + "/";
 9 %> 
10 <!DOCTYPE html>
11 <html>
12 <head>
13 <base href="<%=basePath %>" />
14 <meta charset="UTF-8">
15 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
16 <title>用户管理-用户查询</title>
17 <link href="resource/css/bootstrap.min.css" rel="stylesheet" />
18 <script type="text/javascript" src="resource/js/jquery.min.js"></script>
19 <script type="text/javascript"
20     src="resource/js/bootstrap.min.js"></script>
21 </head>
22 <body>
23     <div>
24         <ul class="breadcrumb" style="margin: 0px;">
25             <li>系统管理</li>
26             <li>用户管理</li>
27             <li>用户查询</li>
28         </ul>
29     </div>
30     <form action="" class="form-inline">
31         <div class="row alert alert-info" style="margin: 0px; padding: 5px;">
32             <div class="form-group">
33                 <label>条件:</label> <select class="form-control">
34                     <option>姓名</option>
35                     <option>性别</option>
36                 </select> <input type="text" class="form-control" placeholder="请输入查询条件" />
37             </div>
38             <input type="button" class="btn btn-danger" value="查询"> <a
39                 href="view/system/userinfo/userinfo_add.jsp" class="btn btn-success">添加用户</a>
40         </div>
41         <div class="row" style="padding: 15px;">
42             <table class="table table-hover table-condensed">
43                 <tr>
44                     <th>用户编号</th>
45                     <th>用户账号</th>
46                     <th>用户密码</th>
47                     <th>用户姓名</th>
48                     <th>用户性别</th>
49                     <th>用户年龄</th>
50                     <td>操作</td>
51                 </tr>
52                 <tr>
53                     <td>1001</td>
54                     <td>admin123</td>
55                     <td>123456</td>
56                     <td>高富帅</td>
57                     <td>男</td>
58                     <td>20</td>
59                     <td><a href="view/system/userinfo/userinfo_update.jsp">修改</a> 删除</td>
60                 </tr>
61                 <tr>
62                     <td>1001</td>
63                     <td>admin123</td>
64                     <td>123456</td>
65                     <td>白富美</td>
66                     <td>女</td>
67                     <td>20</td>
68                     <td>修改 删除</td>
69                 </tr>
70                 <tr>
71                     <td>1001</td>
72                     <td>admin123</td>
73                     <td>123456</td>
74                     <td>高富帅</td>
75                     <td>男</td>
76                     <td>20</td>
77                     <td>修改 删除</td>
78                 </tr>
79                 <tr>
80                     <td>1001</td>
81                     <td>admin123</td>
82                     <td>123456</td>
83                     <td>白富美</td>
84                     <td>女</td>
85                     <td>20</td>
86                     <td>修改 删除</td>
87                 </tr>
88             </table>
89         </div>
90     </form>
91 </body>
92 </html>

将用户信息插入界面的原型html修改为jsp

  1 <%@ page language="java" contentType="text/html; charset=UTF-8"
  2     pageEncoding="UTF-8"%>
  3 <%
  4     //获取绝对路径路径 
  5     String path = request.getContextPath();
  6     String basePath = request.getScheme() + "://"
  7                 + request.getServerName() + ":" + request.getServerPort()
  8                 + path + "/";
  9 %> 
 10 <!DOCTYPE html>
 11 <html>
 12 <head>
 13 <base href="<%=basePath %>" />
 14 <meta charset="UTF-8">
 15 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 16 <title>用户管理-用户添加</title>
 17 <link href="resource/css/bootstrap.min.css" rel="stylesheet" />
 18 <script type="text/javascript" src="resource/js/jquery.min.js"></script>
 19 <script type="text/javascript"
 20     src="resource/js/bootstrap.min.js"></script>
 21 </head>
 22 <body>
 23     <div>
 24         <ul class="breadcrumb" style="margin: 0px;">
 25             <li>系统管理</li>
 26             <li>用户管理</li>
 27             <li>用户添加</li>
 28         </ul>
 29     </div>
 30 <form action="system/userinfoinsert" class="form-horizontal" method="post">
 31         <h5 class="page-header alert-info"
 32             style="margin: 0px; padding: 10px; margin-bottom: 10px;">基本信息</h5>
 33         <!-- 开始1 -->
 34         <div class="row">
 35             <div class="col-xs-5">
 36                 <div class="form-group ">
 37                     <label class="col-xs-3 control-label">用户学号</label>
 38                     <div class="col-xs-9 ">
 39                         <input type="text" name="userNumber" class="form-control" placeholder="请输入用户学号" />
 40                     </div>
 41                 </div>
 42             </div>
 43             <div class="col-xs-5">
 44                 <div class="form-group ">
 45                     <label class="col-xs-3 control-label">用户姓名</label>
 46                     <div class="col-xs-9 ">
 47                         <input type="text" name="userName" class="form-control" placeholder="请输入用户姓名" />
 48                     </div>
 49                 </div>
 50             </div>
 51         </div>
 52         <!--结束1 -->
 53         <!-- 开始2 -->
 54         <div class="row">
 55             <div class="col-xs-5">
 56                 <div class="form-group ">
 57                     <label class="col-xs-3 control-label">用户年龄</label>
 58                     <div class="col-xs-9 ">
 59                         <input type="text" name="userAge" class="form-control" placeholder="请输入用户年龄" />
 60                     </div>
 61                 </div>
 62             </div>
 63             <div class="col-xs-5">
 64                 <div class="form-group ">
 65                     <label class="col-xs-3 control-label">用户性别</label>
 66                     <div class="col-xs-3 ">
 67                         <select class="form-control" name="userSex">
 68                             <option>保密</option>
 69                             <option>男</option>
 70                             <option>女</option>
 71                         </select>
 72                     </div>
 73                 </div>
 74             </div>
 75 
 76         </div>
 77         <!--结束2 -->
 78 
 79 
 80         <h5 class="page-header alert-info"
 81             style="margin: 0px; padding: 10px; margin-bottom: 10px;">账号信息</h5>
 82         <!-- 开始5 -->
 83         <div class="row">
 84             <div class="col-xs-5">
 85                 <div class="form-group ">
 86                     <label class="col-xs-3 control-label">用户账号</label>
 87                     <div class="col-xs-9">
 88                         <input type="text" name="userAccount" class="form-control" placeholder="请输入用户账号" />
 89                     </div>
 90                 </div>
 91             </div>
 92             <div class="col-xs-5">
 93                 <div class="form-group ">
 94                     <label class="col-xs-3 control-label">用户密码</label>
 95                     <div class="col-xs-9 ">
 96                         <input type="text" name="userPw" class="form-control" placeholder="请输入用户密码" />
 97                     </div>
 98                 </div>
 99             </div>
100         </div>
101         <!--结束5 -->
102 
103         <div class="row">
104             <div class="col-xs-3 col-xs-offset-4">
105                 <input type="submit" class="btn btn-success" value="保存用户" /> <input
106                     type="reset" class="btn btn-danger" value="重置信息" />
107             </div>
108 
109         </div>
110 
111     </form>
112 </body>
113 </html>

将用户信息更改界面的原型html修改为jsp

  1 <%@ page language="java" contentType="text/html; charset=UTF-8"
  2     pageEncoding="UTF-8"%>
  3 <%
  4     //获取绝对路径路径 
  5     String path = request.getContextPath();
  6     String basePath = request.getScheme() + "://"
  7                 + request.getServerName() + ":" + request.getServerPort()
  8                 + path + "/";
  9 %> 
 10 <!DOCTYPE html>
 11 <html>
 12 <head>
 13 <base href="<%=basePath %>" />
 14 <meta charset="UTF-8">
 15 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 16 <title>用户管理-用户修改</title>
 17 <link href="resource/css/bootstrap.min.css" rel="stylesheet" />
 18 <script type="text/javascript" src="resource/js/jquery.min.js"></script>
 19 <script type="text/javascript"
 20     src="resource/js/bootstrap.min.js"></script>
 21 </head>
 22 <body>
 23     <div>
 24         <ul class="breadcrumb" style="margin: 0px;">
 25             <li>系统管理</li>
 26             <li>用户管理</li>
 27             <li>用户修改</li>
 28         </ul>
 29     </div>
 30 <form action="" class="form-horizontal">
 31         <h5 class="page-header alert-info"
 32             style="margin: 0px; padding: 10px; margin-bottom: 10px;">基本信息</h5>
 33         <!-- 开始1 -->
 34         <div class="row">
 35             <div class="col-xs-5">
 36                 <div class="form-group ">
 37                     <label class="col-xs-3 control-label">用户姓名</label>
 38                     <div class="col-xs-9 ">
 39                         <input type="text" class="form-control" placeholder="请输入用户姓名" value="高富帅" />
 40                     </div>
 41                 </div>
 42             </div>
 43             <div class="col-xs-5">
 44                 <div class="form-group ">
 45                     <label class="col-xs-3 control-label">用户年龄</label>
 46                     <div class="col-xs-9 ">
 47                         <input type="text" class="form-control" placeholder="请输入用户年龄" value="20" />
 48                     </div>
 49                 </div>
 50             </div>
 51         </div>
 52         <!--结束1 -->
 53         <!-- 开始2 -->
 54         <div class="row">
 55             <div class="col-xs-5">
 56                 <div class="form-group ">
 57                     <label class="col-xs-3 control-label">用户性别</label>
 58                     <div class="col-xs-3 ">
 59                         <select class="form-control">
 60                             <option>保密</option>
 61                             <option>男</option>
 62                             <option>女</option>
 63                         </select>
 64                     </div>
 65                 </div>
 66             </div>
 67 
 68         </div>
 69         <!--结束2 -->
 70 
 71 
 72         <h5 class="page-header alert-info"
 73             style="margin: 0px; padding: 10px; margin-bottom: 10px;">账号信息</h5>
 74         <!-- 开始5 -->
 75         <div class="row">
 76             <div class="col-xs-5">
 77                 <div class="form-group ">
 78                     <label class="col-xs-3 control-label">用户账号</label>
 79                     <div class="col-xs-9">
 80                         <input type="text" class="form-control" placeholder="请输入用户账号" value="admin123" />
 81                     </div>
 82                 </div>
 83             </div>
 84             <div class="col-xs-5">
 85                 <div class="form-group ">
 86                     <label class="col-xs-3 control-label">用户密码</label>
 87                     <div class="col-xs-9 ">
 88                         <input type="text" class="form-control" placeholder="请输入用户密码" value="123456" />
 89                     </div>
 90                 </div>
 91             </div>
 92         </div>
 93         <!--结束5 -->
 94 
 95         <div class="row">
 96             <div class="col-xs-3 col-xs-offset-4">
 97                 <input type="submit" class="btn btn-success" value="保存用户" /> <input
 98                     type="reset" class="btn btn-danger" value="重置信息" />
 99             </div>
100 
101         </div>
102 
103     </form>
104 </body>
105 </html>

用户信息提示信息界面的jsp

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <%
 4     //获取绝对路径路径 
 5     String path = request.getContextPath();
 6     String basePath = request.getScheme() + "://"
 7                 + request.getServerName() + ":" + request.getServerPort()
 8                 + path + "/";
 9 %> 
10 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
11 <html>
12 <head>
13 <base href="<%=basePath %>" />
14 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
15 <title>Insert title here</title>
16 </head>
17 <body>
18 <script type="text/javascript">
19     //此页面用来提示添加,修改,删除信息的成功或者失败的信息
20     alert('${info}');//提示信息,错误or成功
21     //跳转到user_info.jsp查询页面,后面会修改为servlet
22     window.location="view/system/userinfo/userinfo_list.jsp";
23 </script>
24 </body>
25 </html>

至此用户信息的登录界面,主页面基本设计的差不多了,接下来就开始进行开发了。

开始基于后台逻辑代码进行开发:

  1:这里我使用的是将数据库的驱动driver,数据库连接字符串,数据库账号,密码写到db.properties配置文件中,代码如下:

1 drivername=com.mysql.jdbc.Driver
2 url=jdbc:mysql:///book
3 user=root
4 password=123456

2:写好配置文件,接下来写utils工具类,代码如下,写好连接数据库的工具类,个人习惯测试了一下,避免连接数据库就发生错误,那就糗大了。

    顺便提一下,添加信息和更改信息我直接也封装到了这个工具类中,方便使用,减少重复代码的书写,当然对于新手,多写重复代码是一件好事,

    加强记忆和理解

  1 package com.bie.utils;
  2 
  3 import java.sql.Connection;
  4 import java.sql.DriverManager;
  5 import java.sql.PreparedStatement;
  6 import java.sql.ResultSet;
  7 import java.util.ResourceBundle;
  8 
  9 /***
 10  * 1.1:写DbUtils的工具类
 11  * :utils是工具类,方便以后调用
 12  * 在main方法测试的时候出现一个错误,
 13  * 瞄了一眼立马想到了没有添加mysql的驱动,
 14  * 所以我感觉测试还是很有必要的
 15  * @author biehongli
 16  *
 17  */
 18 public class DbUtils {
 19 
 20     private static String drivername;//数据库驱动,为了加载数据库驱动
 21     private static String url;//数据库连接字符串,只要是找到自己的数据库,需要和自己的数据库一致
 22     private static String user;//数据库账号,需要和自己的一致
 23     private static String password;//数据库密码,需要和自己的一致
 24     
 25     static{
 26         drivername=ResourceBundle.getBundle("db").getString("drivername");
 27         url=ResourceBundle.getBundle("db").getString("url");
 28         user=ResourceBundle.getBundle("db").getString("user");
 29         password=ResourceBundle.getBundle("db").getString("password");
 30     }
 31     
 32     /***
 33      * 加载数据库驱动和连接到数据库,我一般是加载和连接的时候分别输出,可以快速找到哪里出错
 34      * @return
 35      * @throws Exception
 36      */
 37     public static Connection getCon() throws Exception{
 38         Class.forName(drivername);//记载数据库驱动
 39         System.out.println("测试加载数据库驱动");
 40         //连接到数据库
 41         Connection con=DriverManager.getConnection(url, user, password);
 42         System.out.println("测试连接到数据库");
 43         return con;
 44     }
 45     
 46     /***
 47      * 这个用来判断关闭数据库的方法
 48      * @param con 关闭Connection的连接
 49      * @param ps  关闭PreparedStatement
 50      * @param rs  关闭ResultSet
 51      */
 52     public static void getClose(Connection con,PreparedStatement ps,ResultSet rs){
 53         //关闭数据库,注意关闭的顺序。养成好习惯
 54         try{
 55             if(rs!=null){
 56                 rs.close();
 57             }
 58             if(ps!=null){
 59                 ps.close();
 60             }
 61             if(con!=null){
 62                 con.close();
 63             }
 64         }catch(Exception e){
 65             e.printStackTrace();
 66         }
 67     }
 68     
 69     /***
 70      * 添加(插入)和更新(更改)可以提取公共的方法写在工具类中
 71      * 删除一般使用伪删除,这样删除就是更新(更改)操作,
 72      * 所以只有查询(查找)需要写更多的代码
 73      * @param sql 外面传来的sql语句
 74      * @param arr 外面传来的数组类型的,是用户信息封装到集合传递进来
 75      * @return 返回的是一个整形的数据类型
 76      */
 77     public static int addAndUpdate(String sql,Object[] arr){
 78         Connection con=null;
 79         PreparedStatement ps=null;
 80         try{
 81             con=DbUtils.getCon();//第一步连接数据库
 82             ps=con.prepareStatement(sql);//第二步预编译
 83             //第三步给sql语句中的参数复制
 84             for(int i=0;i<arr.length;i++){
 85                 ps.setObject(i+1, arr[i]);
 86             }
 87             //第四步执行sql并且返回。
 88             return ps.executeUpdate();
 89         }catch(Exception e){
 90             e.printStackTrace();
 91         }finally{
 92             //关闭资源,如果没有ResultSet类型的,加上null即可
 93             DbUtils.getClose(con, ps, null);
 94         }
 95         return 0;
 96     }
 97     /*public static void main(String[] args) {
 98         //我一般在写好连接数据库的工具类时先测试一下,避免连接数据库都失败,测试后可注释即可
 99         try {
100             DbUtils.getCon();
101             System.out.println("测试连接数据库终极版!!!");
102         } catch (Exception e) {
103             e.printStackTrace();
104         }
105     }*/
106 }

 3:开始写实体类po层。这个实体类里面是用户信息的成员变量。

 1 package com.bie.po;
 2 /***
 3  * 1.2:写用户信息的实体类
 4  * 需要和自己设计好的数据库信息相对应。
 5  * @author biehongli
 6  *
 7  */
 8 public class UserInfo {
 9 
10     private Integer userId;//用户编号
11     private String userAccount;//用户账号
12     private String userPw;//用户密码
13     private String userNumber;//用户学号
14     private String userName;//用户姓名
15     private Integer userAge;//用户年龄
16     private String  userSex;//用户性别
17     private String userMark;//用户标识,可以使用一张表,完成管理员和用户
18     //如果对setxxx,getxxx灰常熟练了,自动生成即可
19     public Integer getUserId() {
20         return userId;
21     }
22     public void setUserId(Integer userId) {
23         this.userId = userId;
24     }
25     public String getUserAccount() {
26         return userAccount;
27     }
28     public void setUserAccount(String userAccount) {
29         this.userAccount = userAccount;
30     }
31     public String getUserPw() {
32         return userPw;
33     }
34     public void setUserPw(String userPw) {
35         this.userPw = userPw;
36     }
37     public String getUserNumber() {
38         return userNumber;
39     }
40     public void setUserNumber(String userNumber) {
41         this.userNumber = userNumber;
42     }
43     public String getUserName() {
44         return userName;
45     }
46     public void setUserName(String userName) {
47         this.userName = userName;
48     }
49     public Integer getUserAge() {
50         return userAge;
51     }
52     public void setUserAge(Integer userAge) {
53         this.userAge = userAge;
54     }
55     public String getUserSex() {
56         return userSex;
57     }
58     public void setUserSex(String userSex) {
59         this.userSex = userSex;
60     }
61     public String getUserMark() {
62         return userMark;
63     }
64     public void setUserMark(String userMark) {
65         this.userMark = userMark;
66     }
67     //重写toString()方法
68     @Override
69     public String toString() {
70         return "UserInfo [userId=" + userId + ", userAccount=" + userAccount + ", userPw=" + userPw + ", userNumber="
71                 + userNumber + ", userName=" + userName + ", userAge=" + userAge + ", userSex=" + userSex
72                 + ", userMark=" + userMark + "]";
73     }
74     
75     
76 }

4:写好实体类,接着写处理业务逻辑,这里是写的插入,所以省去了dao层,如果是查询还需要先写dao层(数据交互层),这里先写接口,然后写实现接口的类。

 1 package com.bie.system.service;
 2 
 3 import com.bie.po.UserInfo;
 4 
 5 /***
 6  * 1.3:如果没有在工具类DbUtils中封装addAndUpdate,
 7  *    那么需要现在dao层(数据访问层)写和数据库相关操作的代码
 8  *    如果封装好了,直接在service(业务逻辑层)写代码即可。
 9  * 我的习惯实现写接口再写实现接口的类。
10  * @author biehongli
11  *
12  */
13 public interface UserInfoInsertService {
14 
15     /***
16      * 向数据库插入(添加)数据(用户的信息)
17      * @param user  用户的信息
18      * @return true表示插入成功,false表示插入失败
19      */
20     public boolean insertUser(UserInfo user);
21     
22 }

 5:写好接口,写实现接口的类,作为一个新手,最好写好service业务逻辑层进行junit测试,避免后期写一大推代码,错误多的不知道哪里错了。

 1 package com.bie.system.service.impl;
 2 
 3 import java.util.ArrayList;
 4 import java.util.List;
 5 
 6 import com.bie.po.UserInfo;
 7 import com.bie.system.service.UserInfoInsertService;
 8 import com.bie.utils.DbUtils;
 9 import com.bie.utils.MarkUtils;
10 /***
11  * 1.4:这是业务逻辑层的实现类,实现用户信息的接口
12  * 
13  * 切忌新手写好service业务逻辑层需要test测试(junit)
14  * @author biehongli
15  *
16  */
17 public class UserInfoInsertServiceImpl implements UserInfoInsertService{
18 
19     @Override
20     public boolean insertUser(UserInfo user) {
21         try{
22             //System.out.println(user);//测试传来的UserInfo里面是否够存在用户信息
23             if(user!=null && user.getUserAccount()!=null){
24                 String sql="INSERT INTO user_info(user_account,user_pw,"
25                         + "user_number,user_name,user_age,user_sex,user_mark)"
26                         + " VALUES(?,?,?,?,?,?,?)";
27                 List<Object> list=new ArrayList<Object>();
28                 //可以理解位将实体类中get到的信息放到数据库中,因为set设置的信息就是为了查到数据库中
29                 list.add(user.getUserAccount());//将设置好的账号信息保存到集合中
30                 list.add(user.getUserPw());//将设置好的账号信息保存到集合中
31                 list.add(user.getUserNumber());//将设置好的密码信息保存到集合中
32                 list.add(user.getUserName());//将设置好的姓名信息保存到集合中
33                 list.add(user.getUserAge());//将设置好的年龄信息保存到集合中
34                 list.add(user.getUserSex());//将设置好的性别信息保存到集合中
35                 //list.add(user.getUserMark());//将设置好的标识信息保存到集合中
36                 //后台只可以添加管理员
37                 user.setUserMark(MarkUtils.USER_MARK_MANAGER);
38                 //将设置为默认的管理员添加到数据库
39                 list.add(user.getUserMark());
40                 
41                 //将封装到集合list中的信息和sql语句传递到DbUtils封装好的 方法中
42                 //这里sql转化位String语句,list转化位数组类型
43                 int count=DbUtils.addAndUpdate(sql.toString(), list.toArray());
44                 //System.out.println(count);//测试返回值是0还是1
45                 if(count>0){
46                     return true;//成功返回true
47                 }else{
48                     return false;//失败返回false
49                 }
50             }
51         }catch(Exception e){
52             e.printStackTrace();
53         }
54         return false;
55     }
56 
57     
58 }

6:写好service,业务逻辑处理层,开始使用junit进行测试。测试结果就不粘贴了,遇到的测试错误已经在代码中注释了。

 1 package com.bie.system.service.impl;
 2 
 3 import org.junit.Test;
 4 
 5 import com.bie.po.UserInfo;
 6 import com.bie.system.service.UserInfoInsertService;
 7 
 8 /***
 9  * 1.5:测试的类
10  * @author biehongli
11  *
12  */
13 public class UserInfoInsertServiceImplTest {
14 
15     private UserInfoInsertService service=new UserInfoInsertServiceImpl();
16     
17     //测试的时候出点错,String sql="INSERT INTO user_info(user_account,user_pw,user_number,user_name,user_age,user_sex,user_mark) VALUES(?,?,?,?,?,?,?)";
18     //插入语句写字段的时候加了''导致出错,找了一会,所以写好service业务逻辑层测试还是很重要的
19     @Test
20     public void insert(){
21         UserInfo user=new UserInfo();
22         user.setUserAccount("别先生");
23         user.setUserPw("666666");
24         user.setUserNumber("123456789");
25         user.setUserName("小别同志");
26         user.setUserAge(23);
27         user.setUserSex("爷们");
28         user.setUserMark("1");
29         boolean mark=service.insertUser(user);
30         if(mark){
31             System.out.println("插入成功!!!");
32         }else{
33             System.out.println("明天考试了,今天还不复习,失败了吧!!!");
34         }
35     }
36 }

7:测试好,修改好,没啥问题开始进行servlet层写代码。这里使用了RequestBeanUtils,用法和3个jar包都在上面连接里面都有。

  需要注意的是userinfo_add.jsp的form的action路径和method="post"方法,具体的实现细节就不做多叙述了。代码写的很详细了。

 1 package com.bie.system.servlet;
 2 
 3 import java.io.IOException;
 4 
 5 import javax.servlet.ServletException;
 6 import javax.servlet.annotation.WebServlet;
 7 import javax.servlet.http.HttpServlet;
 8 import javax.servlet.http.HttpServletRequest;
 9 import javax.servlet.http.HttpServletResponse;
10 
11 import com.bie.po.UserInfo;
12 import com.bie.system.service.UserInfoInsertService;
13 import com.bie.system.service.impl.UserInfoInsertServiceImpl;
14 import com.my.web.servlet.RequestBeanUtils;
15 
16 /***
17  * 1.7:这里使用servlet3.0,说明一下,
18  * 同时使用了RequestBeanUtils,这个要求表单的name属性必须和实体类UserInfo的成员变量名称一致
19  *         使用方法如下
20  * 注解的要求是模块名称加功能比如/system/userinfoinsert,避免后面发生错误
21  * @author biehongli
22  *
23  */
24 @WebServlet("/system/userinfoinsert")
25 public class UserInfoInsertServlet extends HttpServlet{
26 
27     private static final long serialVersionUID = 1L;//序列号
28 
29     @Override
30     protected void doPost(HttpServletRequest request, HttpServletResponse response) 
31             throws ServletException, IOException {
32         //RequestBeanUtils的使用方法,需要导入三个包。
33         //commons-beanutils-1.8.3.jar  commons-logging-1.1.1.jar
34         //commy-web-0.0.1.jar
35         UserInfo user=RequestBeanUtils.requestToSimpleBean(request, UserInfo.class);
36         System.out.println(user);//测试到这里是否出现bug
37         //然后在servlet层调用service逻辑处理层
38         UserInfoInsertService service=new UserInfoInsertServiceImpl();
39         //调用service逻辑处理层的插入方法,返回布尔类型
40         boolean mark=service.insertUser(user);
41         //返回提示信息到页面
42         if(mark){
43             request.setAttribute("info", "用户信息添加成功!!!");
44         }else{
45             request.setAttribute("info", "用户信息添加失败!!!");
46         }
47         //转发到页面(重定向)user_info.jsp提示信息,成功或者失败
48         request.getRequestDispatcher("/view/system/userinfo/user_info.jsp").forward(request, response);
49     }
50             
51 }

8:在写servlet的时候需要考虑乱码问题,这里在工具类写了公共的方法,过滤所有请求,设置字符集为utf-8。

 1 package com.bie.utils;
 2 
 3 import java.io.IOException;
 4 
 5 import javax.servlet.Filter;
 6 import javax.servlet.FilterChain;
 7 import javax.servlet.FilterConfig;
 8 import javax.servlet.ServletException;
 9 import javax.servlet.ServletRequest;
10 import javax.servlet.ServletResponse;
11 import javax.servlet.annotation.WebFilter;
12 /****
13  * 1.8:处理乱码的过滤器
14  * @WebFilter("/*")过滤所有的请求
15  * @author biehongli
16  *
17  */
18 @WebFilter("/*")
19 public class UtfFilter implements Filter{
20 
21     @Override
22     public void destroy() {
23         // TODO Auto-generated method stub
24         
25     }
26 
27     @Override
28     public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, 
29             FilterChain filterChain)throws IOException, ServletException {
30         //处理乱码,设置字符集为utf-8
31         servletRequest.setCharacterEncoding("utf-8");
32         filterChain.doFilter(servletRequest, servletResponse);
33     }
34 
35     @Override
36     public void init(FilterConfig arg0) throws ServletException {
37         // TODO Auto-generated method stub
38         
39     }
40 
41     
42 }

  9:最后我使用一张表完成管理员和普通用户的区别,所有有一个user_mark的字段,这里设置一下,使用0和1代表管理员和普通用户,需要注意的是这里开发的是后台,所以只可以添加管理员,所以设置固定即可。

 1 package com.bie.utils;
 2 /***
 3  * 1.9用户管理标识的工具类,用来写管理员和普通用户的标识
 4  * @author biehongli
 5  *
 6  */
 7 public class MarkUtils {
 8 
 9     //用户信息的的标识
10     public static final String USER_MARK_MEMBER="0";//0代表普通会员
11     public static final String USER_MARK_MANAGER="1";//1代表管理员
12     
13     
14 }

  最后这里暂时还没有直接将插入的信息直接显示在页面上,下篇博客将实现此功能,

  下面演示一下实现的效果,如果想看代码结构和源码可以去上面的连接下载即可。

提示信息如下所示:

最后可以先去数据库查看测试数据是否插入成功:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏hotqin888的专栏

beego利用casbin进行权限管理——第四节 策略更新

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/hotqin888/article/det...

571
来自专栏散尽浮华

DNS之BIND使用小结(Forward转发)

之前详细介绍了DNS及其在linux下的部署过程,今天再说下DNS的BIND高级特性-forwarder转发功能。比如下面一个案例: 1)已经在测试环境下部署了...

1193
来自专栏有困难要上,没有困难创造困难也要上!

Python3运行时查看线程信息

2515
来自专栏c#开发者

使用BizTalk实现RosettaNet B2B So Easy

使用BizTalk实现RosettaNet B2B So Easy 最近完成了一个vmi-hub的B2B项目,使用Rosettanet 2.0的标准与一家品牌商...

33414
来自专栏前端大白专栏

关于在reactjs项目中如何用webpack配置组件按需加载

1776
来自专栏Android开发指南

1.入门和eclipse

33016
来自专栏云计算教程系列

如何在CVM上同步自建数据库的数据?

Transporter是一种用于在不同数据存储之间移动数据的开源工具。开发人员经常为诸如跨数据库移动数据,将数据从文件移动到数据库或反之亦然等任务编写一次性脚本...

15812
来自专栏信安之路

linux下反弹shell的姿势

通常在获得webshell之后,如果是linux的服务器,一般会返回一个shell来对linux服务器做进一步的渗透,如:溢出提权、信息收集等。下面就说说lin...

940
来自专栏一枝花算不算浪漫

集群下session共享问题的解决方案.

41910
来自专栏菜鸟程序员

Foosun DotNetCMS2.0登录绕过漏洞

1034

扫码关注云+社区