ExtJS之Store-白红宇

ExtJS之Store

阅读量：2781 次

发布时间：2019-05-13

本文共 2170 字，大约阅读时间需要 7 分钟。

据目前所知：Store至少分为两类，一个是SimpleStore，另一个是JsonStore。

1，用在gridPanel中常使用SimpleStore

       Js代码   
 var store_stat = new Ext.data.SimpleStore({   
             fields:[  
             {name:'date',mapping:'date'}  
             ,{name:'model',mapping:'model'}  
             ,{name:'per',mapping:'per'}  
             ]  
         });  

2，填充表单中的下拉菜单（combo），常用JsonStore。

（1）简单JsonStore

       Js代码   
 var data=[{ 
'id':1,'name':'小王','sex':'男'},  
               { 
'id':2,'name':'小李','sex':'男'},  
               { 
'id':3,'name':'小兰','sex':'女'},  
               ];  
       
     var store = new Ext.data.JsonStore({  
             data:data,  
             fields:['id','name','sex']  
         });  

批注：当时静态数据时，fields可以是['id','name','sex']，

如果是通过url动态获取数据是，必须是fields:[{name:'id'},{name:'suit'},{name:'type'}]

（2）通过url获取数据

例如，

       Js代码   
 var store_modellist2 = new Ext.data.JsonStore({  
         fields:['model'],  
         url:'api/fail.php',  
         root:'data',  
         baseParams:{action:'get_all_models'}  
     });  
     store_modellist2.load();  
   
 var combo_model2 = new Ext.form.ComboBox({  
             width:100,  
             editable:false,  
             triggerAction:'all',  
             allowBlank:false,  
             store:store_modellist2,  
             displayField:'model',  
             value:"\u8BF7\u9009\u62E9\u673A\u578B",  
             allQuery:"", //开启此项后，选择机型时将不再在此获取机型数据  
             listeners:{  
             'select' : function(obj, data, index){  
                     var modelName = obj.getValue();  
                     if(modelName !== "\u8BF7\u9009\u62E9\u673A\u578B"){  
                         refresh_fail_chart(modelName);  
                     }  
                 }  
             }  
             //,mode:'local'  
         });  

注：先后顺序不能颠倒。先JsonStore，后ComboBox。

（3）高级用法对比

       Js代码   
 //用法一  
 var jsonStore = new Ext.data.JsonStore({  
     url: 'api/fail_parts_bydepart.php',  
     listeners:{  
        'loadexception' : function(e){  
         alert(e.toString());  
         }  
     },  
     fields: [  
     {name: 'name'},  
     {name: 'flash'},  
     {name: 'percent'}  
           
     ]  
 });  
   
   
 jsonStore.load({  
     params:{  
         'level' : level,  
         'department' : paras.department,  
         'product': paras.product,  
         'target': is_one,  
         'suit':paras.suit,  
         'model':paras.model,  
         'part':paras.part,  
         'dateStr':dateStr  
     }  
 });  
   
 //用法二  
 var store = {  
     'department' : new Ext.data.JsonStore({  
         url: 'api/list_k.php?action=department',  
         fields: ['name']}),   
     'product' : new Ext.data.JsonStore({  
         url: 'api/list_k.php?action=product',  
         fields: ['name']})  
 };  
   
 store.product.baseParams = { 
'department' : encodeURIComponent(data.data.name)};  
 store.product.load();  
   
   
 detailStore.on('beforeload', function() {  
   detailStore.baseParams = {  
     
   };  
 });  