extjs中通过tpl实现带图标的ComboBox
来源:互联网 发布:淘宝联盟怎么注册账号 编辑:程序博客网 时间:2024/05/21 12:43
extjs中通过tpl实现带图标的ComboBox
(2010-12-20 19:34:52)转载▼
标签:
extjs
图标
combobox
tpl
it
分类: Extjs在使用extjs中的combobox控件时,通过变更tpl内容,可以很轻松实现提示内容,例如官方示例的examples\form\combos.html下,可以实现下图combobox的选择内容提示信息:
//----2012.1.12新增//
既然可以显示信息文字,当然应该可以显示图片,笔者通过测试,可以这样实现
部分代码如下:
var AddmenuIcon=new Ext.form.ComboBox(
{
name:'AddmenuIcon',
store:new Ext.data.Store(
{
autoLoad:true,
proxy:new Ext.data.HttpProxy(
{url:'Sys_SysMenuManager_Get.asp?Action=ImgFileList'
}),
reader:new Ext.data.JsonReader(
{
},['name','url'])
}),
tpl: '<tpl for="."><div x-combo-list-item :qtip="{url}" class="x-combo-list-item"><img src="{url}" width="16" height="16"> {name}</div></tpl>',
fieldLabel:"菜单图标",
emptyText:'请选择',
...
其中name为图标的名称,url为图标的路径位置,效果图如下:
//----2012.1.12新增//
上面为单行显示,如果多行显示,定义的tpl这样描述:
tpl :'<table><tr><tpl for="."><td class="x-combo-list-item"><img width=16 height=16 src="{url}" /></td><tpl if="xindex % 3 === 0"></tr><tr></tpl></tpl></tr></table>'
其中xindex % 3 3表示3列
其中
0 0
- extjs中通过tpl实现带图标的ComboBox
- extjs中通过tpl实现带图标的ComboBox
- extjs combox tpl 加图标
- 【自绘ComboBox】带图标的ComboBox
- ExtJs combobox 下拉图标
- 在ExtJS的ComboBox组件中实现下拉树效果
- 在ExtJS的ComboBox组件中实现下拉树效果
- 在ExtJS的ComboBox组件中实现下拉树效果
- ExtJs中ComboBox通过表单传值,后台要得到valueField的值---hiddenName
- Extjs editorgrid combobox 实现显示的值
- Extjs的tpl结合form表单提交
- extjs中 combobox级联
- ExtJs-ComboBox的几个问题
- Extjs Combobox的使用
- Extjs中利用combobox实现全国省市级联
- 实现带图标的ListView
- 实现带图标的ListView
- 选择图标的ComboBox
- Application,Activity, Process,Thread之间的关系
- 设计模式(一)工厂模式Factory(创建型)
- java中接口和抽象类的区别
- 【BZOJ2987】Earthquake
- JAVAWEB——Page 指令
- extjs中通过tpl实现带图标的ComboBox
- 白话Spring(基础篇)---bean的作用域
- SQL Server 2005 2008 清空删除日志文件 130G日志 10秒内变10M
- 堆栈与队列
- markedTextRange理解及使用 计算长度
- cc2640看门狗
- ActiveMQ 即时通讯服务 浅析
- ListView 局部刷新
- ubuntu编译android源码出现的问题记录