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 相关文章推荐
prototype 学习笔记整理
Jul 17 Javascript
javascript学习笔记(九) js对象 设计模式
Jun 19 Javascript
javascript实现倒计时N秒后网页自动跳转代码
Dec 11 Javascript
jQuery中innerWidth()方法用法实例
Jan 19 Javascript
JS动态给对象添加事件的简单方法
Jul 19 Javascript
Node.js使用NodeMailer发送邮件实例代码
Mar 06 Javascript
Angular2实现组件交互的方法分析
Dec 19 Javascript
vue的全局提示框组件实例代码
Feb 26 Javascript
vue 对axios get pust put delete封装的实例代码
Jan 05 Javascript
Vue前端项目部署IIS的实现
Jan 06 Javascript
Js实现复选框的全选、全不选反选功能代码实例
Feb 28 Javascript
低门槛开发iOS、Android、小程序应用的前端框架详解
Oct 16 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
关于Intype一些小问题的解决办法
2008/03/28 PHP
php获取远程图片的两种 CURL方式和sockets方式获取远程图片
2011/11/07 PHP
CodeIgniter基本配置详细介绍
2013/11/12 PHP
PHP关于htmlspecialchars、strip_tags、addslashes的解释
2014/07/04 PHP
php实现文本数据导入SQL SERVER
2015/05/17 PHP
php UNIX时间戳用法详解
2017/02/16 PHP
Laravel 框架控制器 Controller原理与用法实例分析
2020/04/14 PHP
Javascript写了一个清除“logo1_.exe”的杀毒工具(可扫描目录)
2007/02/09 Javascript
极酷的javascirpt,让你随意编辑任何网页
2007/02/25 Javascript
javascript学习笔记(八) js内置对象
2012/06/19 Javascript
使用Jquery实现每日签到功能
2015/04/03 Javascript
在Python中使用glob模块查找文件路径的方法
2015/06/17 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
2015/06/19 Javascript
javascript中的正则表达式使用详解
2015/08/30 Javascript
JS实现IE状态栏文字缩放效果代码
2015/10/24 Javascript
使用jquery获取url及url参数的简单实例
2016/06/14 Javascript
node.js Sequelize实现单实例字段或批量自增、自减
2016/12/08 Javascript
微信小程序动态添加分享数据
2017/06/14 Javascript
深入探究node之Transform
2017/07/20 Javascript
jQuery实现的页面遮罩层功能示例【测试可用】
2017/10/14 jQuery
简单实现jquery隔行变色
2017/11/09 jQuery
vue-cli项目修改文件热重载失效的解决方法
2018/09/19 Javascript
layui lay-verify form表单自定义验证规则详解
2019/09/18 Javascript
Element el-button 按钮组件的使用详解
2021/02/01 Javascript
[05:05]第三天的dota2
2013/07/29 DOTA
Python简单实现子网掩码转换的方法
2016/04/13 Python
Python有序字典简单实现方法示例
2017/09/28 Python
Old Navy加拿大官网:美式休闲服饰品牌
2017/09/26 全球购物
英国的屈臣氏:Boots博姿
2017/12/23 全球购物
ghd法国官方网站:英国最受欢迎的美发工具品牌
2019/04/18 全球购物
中班幼儿评语大全
2014/04/30 职场文书
农业局党的群众路线教育实践活动整改方案
2014/09/20 职场文书
2016五一劳动节慰问信
2015/11/30 职场文书
《猴王出世》教学反思
2016/02/23 职场文书
详解如何使用Node.js实现热重载页面
2021/05/06 Javascript
教你利用Selenium+python自动化来解决pip使用异常
2021/05/20 Python