EXTJS2.2组件Combobox下拉框获取数据

1.获取数据 

    var dataPath;
    //远程连接
    var genderStore = new Ext.data.JsonStore({         
            proxy: new Ext.data.HttpProxy({              
                method: "POST",               
                url: "<%=request.getContextPath()%>/tHarvestTableSdep.do?invoke=listTplMapDsForJson"   
            }),
            //root和fields需和后台获取json格式一致   
            root: "data",            
            fields:['dataPath','datasourceName'],    
            id:"departmentStore"
        });

        //本地静态数据
        var store = new Ext.data.SimpleStore({
						fields : ['name', 'dbType'],
						data : [[ "ORACLE",'ORACLE'],[ "MYSQL",'MYSQL']
							,[ "SQLSERVER",'SQLSERVER'],[ "DB2",'DB2']
						]
					});

        //这一步必须要,加载数据仓库连接
        genderStore.load();
        var comboBox =  new Ext.form.ComboBox({
            id:'comboBox',
            mode : 'local',
            store : genderStore,
            width : 300,
            triggerAction: 'all',
            editable: false,
            //如果是静态数据,这句删掉
            hiddenName:'dataPath',
            //展示数据
            displayField : 'datasourceName',
            //option的value
            valueField : 'dataPath',
            fieldLabel : '数据挂载目录',
            listeners:{
                'select':function(arg){
                    //获取选中下拉框的value
                    dataPath = Ext.getCmp("comboBox").getValue();
                }
            }
        });

后台传入前端的数据json格式:

{
	"data": [
        {
	    	"dataPath": "cd669a58f7bb454eb970a3403b01c39a",
	    	"datasourceName": "采集RELA"
	    }, {
	    	"dataPath": "f8d886a810f440e398eaa340eff717b0",
	    	"datasourceName": "数据标准数据源"
    	}, {
	    	"dataPath": "be32616ebbbb43c5a6fae9aa1d927cb5",
	    	"datasourceName": "数据标准采集数据源1008"
	    }
    ]
}

2.数据回显

store.on('load',function(){
    Ext.getCmp('dataPath').setValue(值);
    Ext.getCmp('dataPath').setRawValue(值);

    或:
    form_panel.getForm().findField("dataPath").setValue(值);
    form_panel.getForm().findField("dataPath").setRawValue(值);
})

 后台复杂json格式拼写方法

参考了https://www.jb51.net/article/137203.htm博主的,感谢

        JSONObject jsonObject = new JSONObject();
        List jsonList = new ArrayList<>();
        for (THarvestDatasource tHarvestDatasource : list) {
            JSONObject jsonObject2 = new JSONObject();
            jsonObject2.element("dataPath",tHarvestDatasource.getDataPath());
           jsonObject2.element("datasourceName",tHarvestDatasource.getDatasourceName());
            jsonList.add(jsonObject2);
        }
        jsonObject.element("data",jsonList);

 

 

你可能感兴趣的:(EXT.JS)