EXTJS2.2组件Combobox下拉框获取数据
程序员文章站
2022-07-13 22:45:22
...
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"
});
//这一步必须要,加载数据仓库连接
genderStore.load();
var comboBox = new Ext.form.ComboBox({
id:'comboBox',
mode : 'local',
store : genderStore,
width : 300,
triggerAction: 'all',
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"
}
]
}
后台复杂json格式拼写方法
参考了https://www.jb51.net/article/137203.htm博主的,感谢
JSONObject jsonObject = new JSONObject();
List<JSONObject> 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);
上一篇: WPF中的Style(风格,样式)
推荐阅读
-
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
-
vue父组件异步获取数据传给子组件的方法
-
详解Vue.js基于$.ajax获取数据并与组件的data绑定
-
React Hook父组件获取子组件的数据/函数
-
Angular 2父子组件数据传递之@ViewChild获取子组件详解
-
Angular 2父子组件数据传递之局部变量获取子组件其他成员
-
vue.js 父组件主动获取子组件的数据和方法、子组件主动获取父组件的数据和方法
-
vue使用jsonp获取数据,开发热卖推荐组件
-
解决Jquery下拉框数据动态获取的问题
-
Java进阶篇5_SpringMVC的简介、SpringMVC的组件解析、SpringMVC的数据响应、SpringMVC获取请求数据、SpringMVC拦截器、SpringMVC异常处理机制