Ext中下拉列表ComboBox组件store数据格式用法介绍


Posted in Javascript onJuly 15, 2013
var p_years = new Ext.form.ComboBox( { 
fieldLabel : '统计年份', 
anchor : anchor_w, 
mode : 'remote', 
maxHeight:100, 
triggerAction : 'all', 
selectOnFocus : true, 
forceSelection : true, 
editable : false, 
//store :[['11', '2011'], ['12', '2012'],['13', '2013']] //此为第一种 
store:[2011,2012,2013,2014,2015,2016,2017,2018] //此为第二种,当没有制定value和text的时候,默认提交值与显示值为同一个。 
});

在该组件中,可以直接手写数组格式[ [' value','Text ' ] ,[ ],[ ] ]进行构建,提交值是前者,后者作为显示值。
下面是比较正规用法,从数据库同步数据字典渲染comboBox组件
var proj_main_store = new Ext.data.JsonStore({ 
url : "************", 
fields : ['TEXT', 'VALUE'], 
root : "objs", 
baseParams : { 
"obj/dicttypeid" : "BM_IMPORTANT_PROJ" 
} 
}); 
proj_main_store.addListener("load", function(){ 
proj_main_store.insert(0, new Ext.data.Record({ 
'TEXT' : '全部', 
'VALUE' : "" 
})); 
}); 
var proj_main_type = new Ext.form.ComboBox( { 
fieldLabel : '重点工程', 
anchor : anchor_w, 
mode : 'remote', 
triggerAction : 'all', 
selectOnFocus : true, 
forceSelection : true, 
editable : false, 
valueField : 'VALUE', 
displayField : 'TEXT', 
store : proj_main_store 
});
Javascript 相关文章推荐
javascript 动态数据下的锚点错位问题解决方法
Dec 24 Javascript
js自定义方法通过隐藏iframe实现文件下载
Feb 21 Javascript
jquery分页插件AmSetPager(自写)
Apr 15 Javascript
Js nodeType 属性全面解析
Nov 14 Javascript
javascript转换日期字符串为Date日期对象的方法
Feb 13 Javascript
深入浅析react native es6语法
Dec 09 Javascript
javascript时间戳和日期字符串相互转换代码(超简单)
Jun 22 Javascript
javascript运算符语法全面概述
Jul 14 Javascript
基于javascript实现的快速排序
Dec 02 Javascript
在vscode里使用.vue代码模板的方法
Apr 28 Javascript
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
微信小程序实现简单跑马灯效果
May 26 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 #Javascript
鼠标移动到图片名上,显示图片的简单实例
Jul 14 #Javascript
JS中获取数据库中的值的方法
Jul 14 #Javascript
js 实现日期灵活格式化的小例子
Jul 14 #Javascript
仿谷歌主页js动画效果实现代码
Jul 14 #Javascript
jquery.messager.js插件导致页面抖动的解决方法
Jul 14 #Javascript
jquery实现输入框动态增减的实例代码
Jul 14 #Javascript
You might like
php教程之phpize使用方法
2014/02/12 PHP
PHP实现生成透明背景的PNG缩略图函数分享
2014/07/08 PHP
使用 laravel sms 构建短信验证码发送校验功能
2017/11/06 PHP
Javascript中Eval函数的使用
2010/03/23 Javascript
关于firefox的ElementTraversal 接口 使用说明
2010/11/11 Javascript
一个网马的tips实现分析
2010/11/28 Javascript
JavaScript实现网页图片等比例缩放实现代码及调用方式
2013/02/25 Javascript
你的 mixin 真的兼容 ECMAScript 5 吗?
2013/04/11 Javascript
详解Angular.js的$q.defer()服务异步处理
2016/11/06 Javascript
基于JavaScript实现右键菜单和拖拽功能
2016/11/28 Javascript
Angularjs中三种数据的绑定策略(“@”,“=”,“&”)
2016/12/23 Javascript
node.js入门教程之querystring模块的使用方法
2017/02/27 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
在Debian(Raspberry Pi)树莓派上安装NodeJS的教程详解
2017/09/19 NodeJs
MVVM框架下实现分页功能示例
2018/06/14 Javascript
Vue调用后端java接口的实例代码
2019/10/28 Javascript
Nuxt 项目性能优化调研分析
2020/11/07 Javascript
Python学习资料
2007/02/08 Python
对python的输出和输出格式详解
2018/12/08 Python
Python实现统计英文文章词频的方法分析
2019/01/28 Python
Django 配置多站点多域名的实现步骤
2019/05/17 Python
python3发送request请求及查看返回结果实例
2020/04/30 Python
python如何求100以内的素数
2020/05/27 Python
Python爬虫实例——scrapy框架爬取拉勾网招聘信息
2020/07/14 Python
基于CSS3实现的黑色个性导航菜单效果
2015/09/14 HTML / CSS
印度领先的眼镜电子商务网站:Lenskart
2019/12/16 全球购物
优秀交警事迹材料
2014/01/26 职场文书
食品安全检查制度
2014/02/03 职场文书
应用数学专业求职信
2014/03/14 职场文书
《棉鞋里的阳光》教学反思
2014/04/24 职场文书
《夕阳真美》教学反思
2014/04/27 职场文书
募捐倡议书怎么写
2014/05/14 职场文书
李敖北大演讲稿
2014/05/24 职场文书
调研座谈会发言材料
2014/08/23 职场文书
个人整改措施书面材料
2014/10/24 职场文书
父亲婚礼答谢词
2015/01/04 职场文书