加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

Ext.data.JsonStore的用法

发布时间:2020-12-16 19:25:25 所属栏目:百科 来源:网络整理
导读:Ext.data.JsonStorehtmlheadmeta http-equiv="Content-Type" content="text/html; charset=UTF-8"link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" /script type="text/javascript" src="adapter/ext/ext-base.js"/scriptscript typ
Ext.data.JsonStore
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-all.js"></script>
<script>
Ext.onReady(function(){
    // NOTE: This is an example showing simple state management. During development,// it is generally best to disable state management as dynamically-generated ids
    // can change across page loads,leading to unpredictable results.  The developer
    // should ensure that stable state ids are set for stateful components in real apps.
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
 var store=new Ext.data.JsonStore({ 
  
    //results 表示结果数
    //rows 表示从后台传过来的JSON数据
    data:{ "results": 2,"rows":[
        {"id":1,"city": "suzhou","areacode": "0512","perincome": "2500" },{"id":2,"city": "nanjing","areacode": "025","perincome": "2200" }]},//自动加载(不能用store.load())
    autoLoad:true,totalProperty:"results",root:"rows",fields:['title',{name:'city',mapping:'city'},{name:'areacode',type:'int'},{name:'perincome',mapping:'perincome',{name:'id',mapping:'id',type:'int'}
    ]
  });
   
    // create the Grid
    var grid = new Ext.grid.GridPanel({
        store: store,columns: [
           {id:'city',header: "city",width: 400,sortable: true,dataIndex: 'city'},{header: "areacode",width: 200,dataIndex: 'areacode'},{header: "perincome",dataIndex: 'perincome'}
        ],stripeRows: true,autoExpandColumn: 'city',height:280,width:600,title:'Array Grid'
   });
 grid.on('rowclick',function(grid,rowIndex,e) {
       var recordr = store.getAt(rowIndex);
       alert('id is ' + recordr.get('id') + ',city name is ' + recordr.get('city'));
      // window.open('index.html');//设置转向地址,用于对row的操作,举个例子 当然也可以用location.href等
     });  
 //把此grid放进grid-example里面
    grid.render('grid-example');
});
</script>
<div id="grid-example"></div> 
</html>

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读