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 相关文章推荐
jQuery Ajax 全解析
Feb 08 Javascript
fckeditor 获取文本框值的实现代码
Feb 09 Javascript
jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码
Mar 21 Javascript
jQuery对指定元素中指定字符串进行替换的方法
Mar 17 Javascript
jQuery根据表单name获取值的方法
May 24 Javascript
BootStrap智能表单实战系列(七)验证的支持
Jun 13 Javascript
移动端利用H5实现压缩图片上传功能
Mar 29 Javascript
angularjs中判断ng-repeat是否迭代完的实例
Sep 12 Javascript
jQuery操作cookie的示例代码
Jun 05 jQuery
es6中class类静态方法,静态属性,实例属性,实例方法的理解与应用分析
Feb 15 Javascript
Vue常用传值方式、父传子、子传父及非父子实例分析
Feb 24 Javascript
利用 JavaScript 构建命令行应用
Nov 17 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中拷贝构造函数、赋值运算符重载
2012/07/25 PHP
php利用新浪接口查询ip获取地理位置示例
2014/01/20 PHP
php函数连续调用实例分析
2015/07/30 PHP
一个完整的php文件上传类实例讲解
2015/10/27 PHP
php实现概率性随机抽奖代码
2016/01/02 PHP
jquery连缀语法如何实现
2012/11/29 Javascript
javascript截取字符串(通过substring实现并支持中英文混合)
2013/06/24 Javascript
js中函数调用的两种常用方法使用介绍
2014/07/17 Javascript
js动态生成Html元素实现Post操作(createElement)
2015/09/14 Javascript
深入浅析NodeJs并发异步的回调处理
2015/12/21 NodeJs
理解javascript中try...catch...finally
2015/12/25 Javascript
使用JQuery中的trim()方法去掉前后空格
2016/09/16 Javascript
bootstrap日历插件datetimepicker使用方法
2016/12/14 Javascript
vue2笔记 — vue-router路由懒加载的实现
2017/03/03 Javascript
详解Javascript获取缓存和清除缓存API
2017/05/25 Javascript
jQuery 开发之EasyUI 添加数据的实例
2017/09/26 jQuery
vue自定义指令directive的使用方法
2019/04/07 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
2019/11/20 Javascript
jquery实现两个div中的元素相互拖动的方法分析
2020/04/05 jQuery
javascript设计模式 ? 代理模式原理与用法实例分析
2020/04/16 Javascript
详解javascript void(0)
2020/07/13 Javascript
Python中文件I/O高效操作处理的技巧分享
2017/02/04 Python
Python Nose框架编写测试用例方法
2017/10/26 Python
python机器学习之KNN分类算法
2018/08/29 Python
python用plt画图时,cmp设置方法
2018/12/13 Python
python如何调用百度识图api
2020/09/29 Python
python实现图片转字符画
2021/02/19 Python
关于探究python中sys.argv时遇到的问题详解
2021/02/23 Python
html5手机端页面可以向右滑动导致样式受影响的问题
2018/06/20 HTML / CSS
金鑫耀Java笔试题
2014/09/06 面试题
逃课上网检讨书
2014/02/20 职场文书
诚信考试倡议书
2014/04/15 职场文书
医生个人自我剖析材料
2014/10/08 职场文书
婚内分居协议书范文
2014/11/26 职场文书
市场营销计划书范文
2015/01/16 职场文书
React配置子路由的实现
2021/06/03 Javascript