Grid在web开发中，经常使用，用kissy可以很方便的生成出grid，但是现在的kissy1.3rc版还是有很多不令人满意的地方，比如分页的话，那数据根本列不出来，列高也有点问题，但是
总的说来，kissy还是很不错的！下面我用kissy做了一个小测试，数据是从淘宝jssdk接口中取的！至于grid类的一些详情方法可以去http://docs.kissyui.com/查看
<!DOCTYPE HTML PUBLIC "-//IETF//DTD LEVEL1//EN"> <html> <head> <title>index.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <script src="http://a.tbcdn.cn/apps/top/x/sdk.js?t=120525.js"></script> <link href="http://docs.kissyui.com/kissy-bootstrap/docs/assets/css/dpl.css" rel="stylesheet"> <script src="http://docs.kissyui.com/assets/import-kissy.js"></script> <script type="text/javascript"> TOP.init({ appKey : 21041761,/*appkey */ channelUrl : 'http://127.0.0.1:8080/demo/channel.html'/* channel页面的URL */ }); KISSY.use('grid',function(S,Grid){ var columns = [{ title : '商品id', dataIndex :'num_iid', sortState :'ASC', width : 100 },{ title : '图片', dataIndex : 'pic_url', width : 70, renderer : function(value,record){ return "<img src='"+value+"_40x40.jpg' width='40' height='40'/>"; } },{ title : '商品标题', dataIndex :'title', width : 400 },{ title : '数量', dataIndex : 'num', width : 60 },{ title : '价格', dataIndex : 'price', width : 60 }]; (function(){ TOP.api('rest','post',{ method:'taobao.items.onsale.get', fields:'num_iid,title,pic_url,num,price', session:'6100807488983be1c5e54cf7de7d589444428488b11c7f5308297792' } ,item); })(); //获取出售中的商品回调 function item(resp){ var data = resp.items.item, store = new Grid.Store({autoLoad : false}); var grid = new Grid({ render:'#J_Grid1', columns : S.clone(columns), 750, loadMask : true, plugins:[Grid.Plugins.CheckSelection], store : store }); grid.render(); store.setResult(data); } }); </script> </head> <body> <div id="J_Grid1"></div> </body> </html>
看一下效果图！当然如果要做一个分页也很简单，就是在调接口的时候，对应添加pageNo和pageSize及可！代码很简单，就说一下renderer这个方法吧！其中value是指当前的这个数据
而record是指当前这一行的记录，如果要添加一列是前几列的和，那么这个很重要哦！我用这个主要是插入了一张图片，因为接口返回来的数据是一个链接，有点类似于flex的中渲染吧！
