ext combobox动态加载数据库数据(附前后台)


Posted in Javascript onJune 17, 2014

前台:

var provinceStore = new Ext.data.Store({ 
proxy: new Ext.data.HttpProxy({ url: basePath + "/stationManage/station_getProvinceJSON.action" }), 
reader: new Ext.data.JsonReader( 
{ root: "" }, 
["PROVINCEID", "PROVINCENAME"] 
) 
}); 
//选择省市 
var provinceIDadd = new Ext.form.ComboBox({ 
anchor : '98%', 
id:'provinceIDadd', 
name : "provinceIDAdd1", 
hiddenName : "provinceID", 
displayField : "PROVINCENAME", 
valueField : "PROVINCEID", 
blankText : '请选择站点所属省份', 
emptyText : '请选择站点所属省份', 
fieldLabel : '站点所属省份', 
allowBlank : false, 
editable : false, 
triggerAction : 'all', 
store :provinceStore , 
forceSelection : true, 
mode : 'local', 
selectOnFocus : true 
}) 
provinceStore.load();

后台action代码
public class StationAction extends BaseAction { private List<Map<String, Object>> provinceList; 
public void setProvinceList(List<Map<String, Object>> provinceList) { 
this.provinceList = provinceList; 
} 
public List<Map<String, Object>> getProvinceList() { 
return provinceList; 
} 
public String getProvinceJSON(){ 
String sql="SELECT PK_ID PROVINCEID,NAME PROVINCENAME FROM T_DICT_DISTRICT A WHERE A.DISTRICT_LEVEL=20"; 
provinceList= stationService.findBySQL(sql); 
return "json_getProvinceList"; 
} 
}

strtus xml配置
<result name="json_getProvinceList" type="json" > 
<param name="root">provinceList</param> 
</result>

加载静态数据的下拉选择框
var dataType=[['0','8列'],['1','38列'],['2','21列']]; 
var dataTypeStore = new Ext.data.SimpleStore({ 
fields: ['dataTypeID', 'dataTypeName'], 
data : data 
}); var dataTypedd = new Ext.form.ComboBox({ 
anchor : '98%', 
id:'dataTypeadd', 
name : "dataTypeAdd1", 
hiddenName : "dataType", 
displayField : "dataTypeName", 
valueField : "dataTypeID", 
blankText : '请选择数据格式', 
emptyText : '请选择数据格式', 
fieldLabel : '数据格式', 
allowBlank : false, 
editable : false, 
triggerAction : 'all', 
store :unitStore , 
forceSelection : true, 
mode : 'local', 
selectOnFocus : true 
})
Javascript 相关文章推荐
JS之小练习代码
Oct 12 Javascript
在次封装easyui-Dialog插件实现代码
Nov 14 Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 Javascript
JS模式之简单的订阅者和发布者模式完整实例
Jun 30 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
May 15 Javascript
JQuery异步加载PartialView的方法
Jun 07 Javascript
JavaScript6 let 新语法优势介绍
Jul 15 Javascript
jQuery实现所有验证通过方可提交的表单验证
Nov 21 jQuery
详解bootstrap导航栏.nav与.navbar区别
Nov 23 Javascript
vue select选择框数据变化监听方法
Aug 24 Javascript
jQuery实现的网站banner图片无缝轮播效果完整实例
Jan 28 jQuery
JS+canvas画布实现炫酷的旋转星空效果示例
Feb 13 Javascript
JavaScript实现简单图片滚动附源码下载
Jun 17 #Javascript
jquery列表拖动排列(由项目提取相当好用)
Jun 17 #Javascript
connect中间件session、cookie的使用方法分享
Jun 17 #Javascript
jquery实现当滑动到一定位置时固定效果
Jun 17 #Javascript
jQuery分别获取选中的复选框值的示例
Jun 17 #Javascript
JS获取单击按钮单元格所在行的信息
Jun 17 #Javascript
IE8中使用javascript动态加载CSS的解决方法
Jun 17 #Javascript
You might like
PHP数据库链接类(PDO+Access)实例分享
2013/12/05 PHP
ThinkPHP验证码使用简明教程
2014/03/05 PHP
PHP实现支持GET,POST,Multipart/form-data的HTTP请求类
2014/09/24 PHP
PHP实现格式化文件数据大小显示的方法
2015/01/03 PHP
js实现图片漂浮效果的方法
2015/03/02 Javascript
javascript实现显示和隐藏div方法汇总
2015/08/14 Javascript
JavaScript 七大技巧(一)
2015/12/13 Javascript
JavaScript实现的SHA-1加密算法完整实例
2016/02/02 Javascript
BootStrap Typeahead自动补全插件实例代码
2016/08/10 Javascript
bootstrap是什么_动力节点Java学院整理
2017/07/14 Javascript
微信小程序url与token设置详解
2017/09/26 Javascript
Vue使用mixins实现压缩图片代码
2018/03/14 Javascript
D3.js实现拓扑图的示例代码
2018/06/30 Javascript
JS实现textarea通过换行或者回车把多行数字分割成数组并且去掉数组中空的值
2018/10/29 Javascript
微信小程序图表插件wx-charts用法实例详解
2019/05/20 Javascript
浅谈Vue 函数式组件的使用技巧
2020/06/16 Javascript
jQuery实现穿梭框效果
2021/01/19 jQuery
python解析xml文件实例分享
2013/12/04 Python
Python随手笔记第一篇(2)之初识列表和元组
2016/01/23 Python
python+selenium开发环境搭建图文教程
2017/08/11 Python
Python三种遍历文件目录的方法实例代码
2018/01/19 Python
matplotlib 输出保存指定尺寸的图片方法
2018/05/24 Python
pyqt5与matplotlib的完美结合实例
2019/06/21 Python
Django之路由层的实现
2019/09/09 Python
django 外键创建注意事项说明
2020/05/20 Python
浅析NumPy 切片和索引
2020/09/02 Python
如何开发一款堪比APP的微信小程序(腾讯内部团队分享)
2016/12/22 HTML / CSS
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
上班打牌检讨书
2014/02/07 职场文书
人力资源管理专业自荐书范文
2014/02/10 职场文书
写给医院的感谢信
2015/01/22 职场文书
2016年学校十一国庆节活动总结
2016/04/01 职场文书
您对思维方式了解多少?
2019/12/09 职场文书
Go语言中的UTF-8实现
2021/04/26 Golang
linux下导入、导出mysql数据库命令的实现方法
2021/05/26 MySQL
Mysql调整优化之四种分区方式以及组合分区
2022/04/13 MySQL