解决问题:
http://www.iteye.com/problems/22617
http://www.iteye.com/problems/22681
原问题是,需要在combo上显示一些HTML标签,如 <a/><TestTag>xxx</TestTag>
1.
如果简单的使用combo的话,会如下图
2.
换个思路,把store里面的东西转码下看看?
var c = new Ext.form.ComboBox({
fieldLabel: 'HTML标签',
displayField: 'name',
valueField: 'value',
mode: 'local',
triggerAction: 'all',
store: new Ext.data.SimpleStore({
fields: [{
name: 'name',
convert: function (v) {
return Ext.util.Format.htmlEncode(v);
}
},
'value'],
data: [['xx', '1'], ['<MyTag /> ', '2']]
})
})
发现还是出问题了,如图
问题的原因同学们可以看下Combo的setValue方法.
3.
于是我们可以看下Combo的源码,其实下拉列表就是一个DataView.
所以我们可以考虑在XTemplate这里做手脚
var c = new Ext.form.ComboBox({
fieldLabel:'HTML标签',
displayField:'name',
valueField:'value',
mode: 'local',
triggerAction: 'all',
store:new Ext.data.SimpleStore({
fields:['name','value'],
data:[['xx','1'],['<MyTag /> ','2']]
}),
//这里的values.name中的name就是displayField中的值,自己修改
tpl:'<tpl for="."><div class="x-combo-list-item">{[Ext.util.Format.htmlEncode(values.name)]}</div></tpl>'
})
如图,搞定:
//tz
- 大小: 8.1 KB
- 大小: 9.6 KB
- 大小: 6.1 KB
分享到:
相关推荐
综上所述,ExtJS6的下拉列表(ComboBox)和GridCombo扩展控件提供了强大的功能和灵活性,它们可以用于创建丰富的用户界面,满足各种复杂的业务需求。理解和熟练掌握这些组件的使用,对于开发高质量的Web应用至关重要...
- 要注意处理 `GridComboBox` 的大小和宽度,确保下拉列表可以完全显示内容。 - 自定义事件处理和样式设置是提高用户体验的关键。 通过理解 `GridComboBox` 的原理和配置,我们可以创建出适应各种需求的下拉菜单...
在本例中,我们将重点讨论如何在 ExtJS 2.0 中实现下拉列表功能。 下拉列表在 Web 应用程序中非常常见,通常用于提供可选的选项供用户选择。在 ExtJS 中,下拉列表可以通过创建 `Ext.form.ComboBox` 实现。这个组件...
ExtJS 4 下拉树(TreeCombo)是一种组合控件,它将传统的下拉框与树形结构结合在一起,提供了一种在有限空间内展示层级数据的高效方式。这种控件在很多场合都非常实用,例如在需要用户选择分类或者层级结构的场景中...
其中一个常用的组件就是`ComboBox`(组合框),它可以用来创建一个包含可选择项目的下拉列表。在某些场景下,我们可能需要在`ComboBox`中手动添加一个空选项或者默认选项,例如“所有”、“请选择”等,以便让用户...
EXTJS的下拉列表通常由`Ext.form.field.ComboBox`类创建。全选和去全选功能通常与多选下拉列表关联,EXTJS通过设置`multiSelect: true`属性来启用这个功能。要实现全选和去全选,我们需要自定义一些方法并绑定到相应...
在ExtJS中,下拉列表树控件(ComboBox Tree)是常见的组件之一,它结合了下拉列表和树结构,提供了更丰富的用户界面。这个控件允许用户从一个层级化的数据结构中进行选择,非常适合于展示有层次关系的数据。 在创建...
该资源主要展示了在Extjs6中Combobox控件实现下拉选择多个数据的功能
标题中的“ExtJS下拉列表树控件1”指的是在ExtJS框架中使用的一种特殊的下拉选择组件,它不仅具备了传统的下拉列表功能,还集成了树形结构,允许用户在下拉菜单中选择嵌套层次的数据。这种控件在处理具有层级关系的...
ExtJs3下拉树 分两种方式调用:第一种: xtype : 'combotree', name : 'dm', fieldLabel : 'dm', tree : this.ct this.ct = new Ext.tree.TreePanel({ autoScroll : true, height : 250, border : false, ...
extjs 树形下拉列表框,可以进行数据选择,数据回显。
ExtJs4.2没有直接提供下拉树这个组件,但是有例子可以用,文件位置:ext-4.2.1.883\examples\ux\TreePicker.js 但是它有点小毛病吧:默认显示了根节点;达到最小高度时再展开节点,高度不能自动调整。 所以我做了一...
在EXTJS这个强大的JavaScript框架中,下拉列表(ComboBox)是一种常见的UI组件,它用于创建交互式的下拉选择框。EXTJS的下拉列表不仅提供了基本的选项选择功能,还支持自定义渲染、远程数据加载等多种高级特性。本文...
在EXTJS4中,ComboBox是一个常用的组件,它用于创建下拉选择框,通常用于输入框的辅助选择。这个组件提供了一种用户友好的方式来从一组预定义的选项中进行选择。然而,根据你的标题和描述,你似乎遇到了一个特别的...
主要实现下拉列表复选功能,从Ext.ux.form.LovCombo.js文件改进而来 目前实现的有全选,全不选,自然序,操作序功能 changeSort负责实现操作序功能(即先选的显示顺序在前,后选的在后;取消操作也不影响操作的顺序...
- ComboBox是EXTJS中的一个基础组件,它是一个下拉列表,用户可以输入文本或从下拉列表中选择。 - TreePanel则是EXTJS用来显示树形结构数据的组件,它允许用户展开、折叠节点,以及选择节点。 2. **下拉菜单树...
- **ComboBox:** ExtJS中的ComboBox是一个可搜索的下拉列表,用户可以输入文本,同时会显示匹配的选项。 - **TreePanel:** TreePanel是展示树状数据的组件,它可以折叠/展开节点,支持多选和单选。 - **下拉树...