zoukankan      html  css  js  c++  java
  • springmvc 之 easyUI开发商城管理系统

    1.分页

      url:controller的路径

      pageSize:每页显示的行数 ---后台参数名(rows)

      会向后台传递一个 page参数,表示当前页.---后台参数名(page)

      controller中:

      

    	@RequestMapping("/list")
    	@ResponseBody
    	public EasyUIPageItem itemPage(int page,int rows) {
    		 
    		EasyUIPageItem myEasyUIPageItem = itemService.listByPage(page,rows);
    		return myEasyUIPageItem;
    	}
    

      

      后台接收两个参数 返回一个实体类为(变量名必须为total,和rows)

      class EasyUIPageItem{

        long total;

        list<?> rows;

         get...

        set...

        }

      的json对象

      前端table代码如下

    <thead>
            <tr>
            	<th data-options="field:'ck',checkbox:true"></th>
            	<th data-options="field:'id',60">商品ID</th>
                <th data-options="field:'title',200">商品标题</th>
                <th data-options="field:'cid',100">叶子类目</th>
                <th data-options="field:'sellPoint',100">卖点</th>
                <th data-options="field:'price',70,align:'right',formatter:TAOTAO.formatPrice">价格</th>
                <th data-options="field:'num',70,align:'right'">库存数量</th>
                <th data-options="field:'barcode',100">条形码</th>
                <th data-options="field:'status',60,align:'center',formatter:TAOTAO.formatItemStatus">状态</th>
                <th data-options="field:'created',130,align:'center',formatter:TAOTAO.formatDateTime">创建日期</th>
                <th data-options="field:'updated',130,align:'center',formatter:TAOTAO.formatDateTime">更新日期</th>
            </tr>
        </thead>
    

     2.树状类别显示

     

      在js中找selectItemCat的jQuery方法如下:

      

     initItemCat : function(data){
            $(".selectItemCat").each(function(i,e){
                var _ele = $(e);
                if(data && data.cid){
                    _ele.after("<span style='margin-left:10px;'>"+data.cid+"</span>");
                }else{
                    _ele.after("<span style='margin-left:10px;'></span>");
                }
                _ele.unbind('click').click(function(){
                    $("<div>").css({padding:"5px"}).html("<ul>")
                    .window({
                        '500',
                        height:"450",
                        modal:true,
                        closed:true,
                        iconCls:'icon-save',
                        title:'选择类目',
                        onOpen : function(){
                            var _win = this;
                            $("ul",_win).tree({
                                url:'/item/cat/list',//请求的参数名为 id 
                                animate:true, //      text id   isLeaf的值为state:判断节点状态 分别为open或closed
                                onClick : function(node){
                                    if($(this).tree("isLeaf",node.target)){
                                        // 填写到cid中
                                        _ele.parent().find("[name=cid]").val(node.id);
                                        _ele.next().text(node.text).attr("cid",node.id);
                                        $(_win).window('close');
                                        if(data && data.fun){
                                            data.fun.call(this,node);
                                        }
                                    }
                                }
                            });
                        },
                        onClose : function(){
                            $(this).window("destroy");
                        }
                    }).window('open');
                });
            });
        },
        

      此方法会请求一个url:/item/cat/list

      请求的参数为:id

      后台接收一个参数 返回一个实体类为(变量名必须为id,text.state且state必须为"closed"或"open")

      class EasyUIPageItem{  

       private long id;
       private String text;
       private String state;

          get...

       set...

        }

      的list集合并使用@ResponsBody转换为json对象

      controller为:

            @RequestMapping("item/cat/list")
    	@ResponseBody
    	public List<EasyUIItemCat> catlist(@RequestParam(value="id",defaultValue="0")Long itemCatId) {
    		return 	itemCatService.findItemCat(itemCatId);
    	} 
    

      zookeeper中上传的服务为:

      

            @Override
    	public List<EasyUIItemCat> findItemCat(Long itemCatId) {
    		// TODO Auto-generated method stub
    		List<EasyUIItemCat> list = new ArrayList<>();
    		TbItemCatExample example = new TbItemCatExample();
    		Criteria criteria = example.createCriteria();
    		criteria.andParentIdEqualTo(itemCatId);
    		List<TbItemCat> itemCats = itemCatMapper.selectByExample(example);
    		
    		for(TbItemCat itemCat:itemCats)
    		{
    			EasyUIItemCat easycat = new EasyUIItemCat();
    			easycat.setId(itemCat.getId());
    			easycat.setText(itemCat.getName());
    			easycat.setState(itemCat.getIsParent()?"closed":"open");
    			
    			list.add(easycat);
    		}
    		
    		return list;
    	}    
    

      

      

      

  • 相关阅读:
    Python3 爬取验证代理
    Python每天学一点之Threading和queue
    Python每天学一点之argparse
    [安恒月赛]反序列化字符逃逸
    $AFO$
    洛谷$P3647 [APIO2014]$连珠线 换根$dp$
    线性基学习笔记
    $vjudge CSP-S$专题专练题解
    $POJ2942 Knights of the Round Table$ 图论
    $tarjan$简要学习笔记
  • 原文地址:https://www.cnblogs.com/ssjifm/p/7739187.html
Copyright © 2011-2022 走看看