zoukankan      html  css  js  c++  java
  • 2019年11月6日


           隔了那么久,再次写日记,不,还是叫随笔比较好。暑期自学了SSM框架,大三新学期想找个项目练手。现实呢,你懂的,确实挺扎心的,做得稀稀拉拉的。知识点多,之前的总结还有笔记(不是自己敲的,老师发的,改了些)没怎么复习,以至于开始着手项目一脸懵逼。啊!果然是个半桶水,好,进入主题。
           让我想想今天做了什么?好吧,SSM整合项目,名为人力资源管理信息系统(hrms),项目不是原创,是网上大佬的作品。由于第一次做该项目只求效果,没有起到巩固知识点的效果。这次重做,只为更好的了解别人的作品,虚心取经。
           首先前台虐我千百遍。
           前端系列:
           1.向后台传数据需要引入json相关jar包
            忘记了最基本的操作,导入json的jar包(三个包) ,这一点让我意识到MAVEN管理自动引入jar包的优越性,至少你不需要去记导入的jar包(常用的还是要了解熟知)

          项目所需要的jar包(手工添加,maven不敢用)

          
           2.向后台传参
           参数的类型有基本、对象等类型。这次项目中本想传个对象类型到后台,没成功。最后改成传送多个参数,后台接收到数据后,再将这些数据封装成一个对象,跟原来方式好像差不多的样子,应该是吧...
          

    <script type="text/javascript">
    
    	$(function(){
    	var edit_deptId=0;
    	$(".dept_edit_btn").click(function(){
    		edit_deptId=$(this).parent().parent().find("td:eq(0)").text();
    		alert("id"+edit_deptId);
    		
    		//查询对应deptId的部门信息
    		$.ajax({
    			url:"/SSM_HRMS/dept/queryDeptById/"+edit_deptId,
    			type:"GET",
    			success:function(result){
    				if(result.code==100){
    					var deptData=result.extendInfo.department;//?
    					//回显
    					$("update_deptName").val(deptData.deptName);
    					$("update_deptLeader").val(deptData.deptLeader);
    					
    				}else{
    					alert(result.extendInfo.get_dept_error);
    				}
    			}
    		
    		});
    	});  
    	$(".dept_update_btn").click(function(){
    		var deptName = $("#update_deptName").val();
            var deptLeader = $("#update_deptLeader").val();
            alert(deptName+deptLeader);
    		$.ajax({
    			url:"/SSM_HRMS/dept/updateDept/"+edit_deptId,
    			type:"POST",
    			data:{"deptName":deptName,"deptLeader":deptLeader},
    			traditional:true,
    			success:function(result){
    				if(result.code==100){
    					alert("更新成功!");
    					window.location.href="/SSM_HRMS/dept/queryAllDepts";
    				}else{
    					alert(result.extendInfo.update_dept_error);
    				}
    				
    			}
    		});
    	});
    	});
    </script>

         注意事项:

    •  $(function{}); 该Jquery工厂一定要加上,不然进入模态框后  点击确定会出现无响应的窘境,如下图

    •  通过Ajax函数如何向后台传对象过去? data:$(".update_dept_form").serialize();数据无法传到后台。

    $(".dept_update_btn").click(function () {
            $.ajax({
                url:"/hrms/dept/updateDept/"+edit_deptId,
                type:"PUT",
                data:$(".update_dept_form").serialize(),
                success:function (result) {
                    if(result.code == 100){
                        alert("更新成功!");
                        window.location.href = "/hrms/dept/getDeptList?pageNo="+curPageNo;
                    } else {
                        alert(result.extendInfo.update_dept_error);
                    }
                }

            });

           3.JSP引入js、bootstrap脚本等静态资源时,路径总出错。
    解决如下:

    JSP文件:

    <script type="text/javascript" src="js/jquery-3.4.1.js"></script>
    <link href="bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

    applicationContext-Controller.xml解决访问资源路径问题 (虚拟路径跟绝对路径的映射问题)

    <mvc:resources location="/WEB-INF/js/"  mapping="/dept/js/**"></mvc:resources>
        <mvc:resources location="/WEB-INF/bootstrap-3.3.7-dist/" mapping="/dept/bootstrap-3.3.7-dist/**"></mvc:resources>

          
           4.说到这个bootstrap,他的特色之一模态框(modal()函数),方式有静态、动态打开两种方式,我选择了动态(源码用的是动态,即通过js代码实现)

            5.好,模态框确实打开了,天煞地马上又闪退。各种百度,各种排查。最后....把对应控件(type="button"一定要写,不然默认为submit,我确实是写了。)两个属性全删了,虽然删一个,模态框不会闪退,但不要就觉得完事了,F12轻轻按一下,错误消息早在那儿恭候您,老老实实删了那两个属性吧。这对兄弟一个叫  data-toggle 另一个叫data-target,别收下留情,删了,全删了。不然就卡在闪退这关卡上。(以具体情况为准)

       如下:

    1. 不用这两个属性,无法转到模态框


    2. 而这种情况下,添加这两个属性后就进入模态框闪退  ,懵逼。。。  


           后台系列:
           后台还行,确实还行,整了一个下午的SQL,虽然说dos命令操作mysql好牛X,但这效率...着实令人着急。

          1.编码问题
           老话题,utf  gbk...数据库默认的latin1,啊,真心烦,索性把数据库的编码全改成utf-8(相对lalin,改成utf8的中文内容更占内存)

          1.1 dos窗口的内容显示编码默认为gbk,了解到了叫活动代码页码,我用chcp 65001改成了utf8窗口,看似解决了问题,输入执SQL语句,执行select语句还行(显示没问题,其实这语句内容没有中文),输入insert语句插入数据,试试中文内容,毕竟显示不会出现中文乱码的情况,对吧。结果呢...末尾确实输入分号,回车居然没执行,出现'>的图标,一直回车一直不结束。类似于SQL语句中单引号匹配不对称的问题,我确信是输入SQL语句中的中文部分后,把单引号吃了,还不让我看见,这有点过分了....估摸着此utf8活动页面下,输入中文时,引号要单个输入,单个输入,不然会被吃了,就是不让你见到另一个引号。不对,不是让你看不到,确实被吃了,还是不对。。。。纯英文语句没出什么毛病。
           好吧,不折腾了,回头是岸吧 。默认gbk页面下,进入MySQL ,set names gbk;
    回车直接完事,意思是把数据库的内容在DOS窗口下,编码暂时性的改成gbk,实际上依旧是按照gbk编码方式存储。这条命令熟知,可我。。。还折腾把DOS窗口显示的编码改成utf8,其实还好吧,就是输入中文千万要小心,不然整死你。

          1.2SQL语句语法不熟练,老是问度娘不是个办法,还是练得少啊。

          2.后台接收前台传来的数据,@PathVariable  和@RequestParam的区别

            ·两者区别的引用文章

    今日完成的内容 :departmentUpdate功能实现,代码如下

    前端:

    $(function(){
    	var edit_deptId=0;
    	$(".dept_edit_btn").click(function(){
    		edit_deptId=$(this).parent().parent().find("td:eq(0)").text();
    		alert("id"+edit_deptId);
    		
    		//查询对应deptId的部门信息
    		$.ajax({
    			url:"/SSM_HRMS/dept/queryDeptById/"+edit_deptId,
    			type:"GET",
    			success:function(result){
    				if(result.code==100){
    					var deptData=result.extendInfo.department;//?
    					//回显
    					$("update_deptName").val(deptData.deptName);
    					$("update_deptLeader").val(deptData.deptLeader);
    					
    				}else{
    					alert(result.extendInfo.get_dept_error);
    				}
    			}
    		
    		});
    	});  
    	$(".dept_update_btn").click(function(){
    		var deptName = $("#update_deptName").val();
            var deptLeader = $("#update_deptLeader").val();
            alert(deptName+deptLeader);
    		$.ajax({
    			url:"/SSM_HRMS/dept/updateDept/"+edit_deptId,
    			type:"POST",
    			data:{"deptName":deptName,"deptLeader":deptLeader},
    			traditional:true,
    			success:function(result){
    				if(result.code==100){
    					alert("更新成功!");
    					window.location.href="/SSM_HRMS/dept/queryAllDepts";
    				}else{
    					alert(result.extendInfo.update_dept_error);
    				}
    				
    			}
    		});
    	});
    	});

    后台控制器部分:

    @RequestMapping(value="/queryDeptById/{deptId}",method=RequestMethod.GET)
    	@ResponseBody
    	public JsonMsg queryDeptById(@PathVariable("deptId")Integer deptId) {
    		System.out.println(deptId);
    		Department department=null;
    		if(deptId>0) {
    			department=departmentService.queryDeptById(deptId);
    			System.out.println(department);
    		}
    		if(department!=null) {
    			return JsonMsg.success().addInfo("department", department);
    		}
    		return JsonMsg.fail().addInfo("get_dept_error", "无部门信息!");
    		
    	}
    	
    	/**
    	 * 修改
    	 * @param deptId
    	 * @param department
    	 * @return
    	 */
    	@RequestMapping(value="/updateDept/{deptId}",method=RequestMethod.POST)
    	@ResponseBody
    	public JsonMsg updateDept(@PathVariable("deptId") Integer deptId,@RequestParam("deptName")String deptName,@RequestParam("deptLeader")String deptLeader) {
    		Department department=new Department(deptName, deptLeader);
    		int res=0;
    		System.out.println(deptId+"   "+department);
    		if(deptId>0) {
    			res=departmentService.updateDeptById(deptId,department);
    		}
    		if(res!=1) {
    			return JsonMsg.fail().addInfo("update_dept_error", "部门信息更新失败!");
    		}
    		return JsonMsg.success();
    	}

          
        
            哔哔一下,科三过了,嘿嘿。
              
           
      
      

  • 相关阅读:
    软件工程课后作业一之30道随机四则运算程序2设计思想
    软件工程课后作业一之30道随机四则运算程序
    2015春季学期软件工程之阅读计划
    第一次冲刺 站立会议6
    第一次冲刺 站立会议5
    第一次冲刺 站立会议4
    第一次冲刺 站立会议3
    第一次冲刺 站立会议2
    第一次冲刺 站立会议1
    cnblogs用户体验
  • 原文地址:https://www.cnblogs.com/yh-simon/p/12236669.html
Copyright © 2011-2022 走看看