也许他喜欢大海,而我却姓江。

也许他喜欢大海,而我却姓江。

[学习笔记]spring mvc集成ligeger UI架构之增删改查

Black Element:

作者:duankaige

 

Demo效果界面:

 


 

开发架构:

LigerUI+Spring MVC+Hibernate+JSON+jquery

  1:LigerUI学习知识点总计

(1):关于Lgerui js库的引入,在学习阶段,可以将全部的库导入,减少每次考虑导入哪些JS的学习成本。

[html] view plaincopy

  1. <link href="<%=basePath%>/script/jquery/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />  

  2. <script src="<%=basePath%>/script/jquery/lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>  

  3. <script src="<%=basePath%>/script/jquery/lib/ligerUI/js/core/base.js" type="text/javascript"></script>   

  4. <script src="<%=basePath%>/script/jquery/lib/ligerUI/js/ligerui.min.js" type="text/javascript"></script>  

  5. <script src="<%=basePath%>/script/role.js" type="text/javascript"></script>  

[html] view plaincopy

  1.    

[html] view plaincopy

  1. <p><span style="font-size:12px;">(<span style="font-family:Calibri;">2</span>)<span style="font-family:Calibri;">grid</span>内容修改后,需要调用<span style="font-family:Calibri;">endEdit</span>方法提交修改,这时候通过<span style="font-family:Calibri;">getData</span>得到的数据才是最新的数据。</span></p>  

[javascript] view plaincopy

  1. $grid.endEdit();  

  2.     var dataArray = $grid.getData();  

 

2:JQUERY学习知识点总结

(1):jquery中遍历数组(each),及往数组中添加对象的方法(push)

[javascript] view plaincopy

  1.                 $.each(dataArray, function (index, entity) {  

  2.                     var role=new Role(entity.id,entity.name,entity.remark);  

  3.                     data.push(role.toString());  

  4.                 });  

  5. (2):JS中创建对象,及对象中创建方法  

[javascript] view plaincopy

  1. function  Role(id,name,remark) {  

  2.     this.id=id;  

  3.     this.name=name;  

  4.     this.remark=remark;  

  5.     this.toString=function () {  

  6.         return "id:"+id+";name:"+this.name+";remark:"+remark;  

  7.     }  

  8. }  

  9. (3):JS中 Ajax的数据实现流程  

[javascript] view plaincopy

  1.                 var ids=[];   

  2.                 $.each(selected, function (index, entity) {  

  3.                     ids.push(entity.id);  

  4.                 });  

  5.                 $.ajax({  

  6.                     url: jsCommonPath+'/roleController.do?method=deleteList',  

  7.                     data: 'ids='+ids,  

  8.                     dataType: 'json',  

  9.                     type: 'post',  

  10.                     success: function (result)  

  11.                     {     

  12.                         $grid.loadData();  

  13.                         $.ligerDialog.warn('删除成功');  

  14.                     }  

  15.                 });       

  16.             }});  

  17. 4:学习Filebug 和Post数据的查看办法,及JS断点的方法   

[javascript] view plaincopy

  1.    

5:掌握POST发送一个字符串数组的方法,这时后台可以用一个数组接收array参数的值;

掌握POST传送一个List的办法,需要将对象数组拼装成字符串,在后台接收字符串再解析成对象数组。

[javascript] view plaincopy

  1. var data=[];      

  2.    $.each(dataArray, function (index, entity) {  

  3.     var role=new Role(entity.id,entity.name,entity.remark);  

  4.     data.push(role.toString());  

  5.    });  

  6.        

  7.   $.ajax({  

  8.       url: jsCommonPath+'/roleController.do?method=saveList',  

  9.       data: "Rows="+data,  

  10.       dataType: 'json',  

  11.       type: 'post',  

  12.       success: function (result)  

  13.       {   

  14.         $grid.loadData();  

  15.         $.ligerDialog.success('保存成功');  

  16.       },  

  17.          error: function (message) {  

  18.             $.ligerDialog.error(message);  

  19.          }                

  20.   });         

 掌握POST传送一个对象的方法,能将对象解析成属性和值的组合发到POST数据包中

Spring mvc 的学习总结
1:在配置文件中定义视图时,Order属性可以定义 视图的 匹配顺序。

[html] view plaincopy

  1.     <bean id="viewResolver1" class="org.springframework.web.servlet.view.InternalResourceViewResolver">  

  2.     <property name="viewClass">  

  3.         <value>org.springframework.web.servlet.view.JstlView</value>  

  4.     </property>  

  5.     <property name="prefix">  

  6.         <value>/jsp/</value>  

  7.     </property>  

  8.     <property name="suffix">  

  9.         <value>.jsp</value>  

  10.     </property>  

  11.     <property name="contentType">  

  12.         <value>text/html;charset=UTF8</value>  

  13.     </property>  

  14.     <property name="order">  

  15.         <value>2</value>  

  16.     </property>   

  17. </bean>  

[html] view plaincopy

  1. 2:掌握 注解的使用方法,RequestMapping 用来定义URL和Action的匹配,RequestParam用来定义从request中接收参数,掌握 ModelAndView传送页面和传送JSON数据的方法。  

[java] view plaincopy

  1. @RequestMapping(params ="method=queryView")   

  2. public ModelAndView querySpringView(@RequestParam("page")int page,@RequestParam("pagesize")int pagesize) {        

  3.     PagingBean pagingBean=new PagingBean(pagesize,page);  

  4.     QueryResult queryResult=roleService.queryObjList(new FilterInfo(), pagingBean);  

  5.     List<RoleBean> roleBeanList=queryResult.getResultList();  

  6.     Map resultMap=new HashMap();  

  7.     resultMap.put("Rows", roleBeanList);  

  8.     resultMap.put("Total", queryResult.getTotalRecordNumber());  

  9.     return new ModelAndView("ajax",resultMap);  

  10. }  

[java] view plaincopy

  1. 3:掌握参数中接收数组的方法,这个与上面 删除的JS方法对应   

[java] view plaincopy

  1. @RequestMapping(params ="method=deleteList")   

  2. public ModelAndView deleteObjList(@RequestParam("ids") String[] ids) {  

  3.     roleService.deleteObj(ids);  

  4.     return new ModelAndView("ajax","0","0");  

  5. }     

4: XmlViewResolver用于将其他XML中的视图包含进来

[html] view plaincopy

  1. <bean name="viewResolver" class="org.springframework.web.servlet.view.XmlViewResolver" >  

  2.    <property name="order" value="1"/>  

  3. <property name="location" value="classpath:config/mvc/views.xml"/>  

  4.   </bean>  


本文由:猿人笔记(YuanRenBiji.Com)收集整理,原文地址:

http://blog.csdn.net/duankaige/article/details/7597421

评论

热度(3)

  1. 也许他喜欢大海,而我却姓江。Solo1st's Bolg 转载了此文字