`

[ExtJs 2.02]Combobox的使用

    博客分类:
  • ext
阅读更多
1.简单使用:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>ComboBox</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

		<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
		<link rel="stylesheet" type="text/css"
			href="resources/css/ext-all.css" />
		<script type="text/javascript" src="lib/ext-base.js"></script>
		<script type="text/javascript" src="lib/ext-all.js"></script>
		<script type="text/javascript"
			src="lib/ext-lang-zh_CN.js"></script>
		
<script type="text/javascript">
Ext.onReady(function(){
var CountryCode = [
    ['93','Afghanistan(93)'],
    ['355','Albania  (355)'],
    ['213','Algeria  (213)'],
    ['684','American Samoa  (684)'],
    ['376','Andorra  (376)'],
    ['244','Angola  (244)']
]
var cbb =new Ext.form.ComboBox({
el:'cbb',
emptyText:'请选择...',
                fieldLabel: 'Country Code',
                name:'Country Code',
                forceSelection: true,
                listWidth: 200,
                store: new Ext.data.SimpleStore({
                    fields: ['value', 'text'],
                    data : CountryCode
                    }),
                valueField:'value',
                displayField:'text',
                typeAhead: true,
                mode: 'local',
                triggerAction: 'all',
                selectOnFocus:true,//用户不能自己输入,只能选择列表中有的记录
                allowBlank:false
            })
cbb.render();
});
</script>
	</head>

	<body>
	<input id='cbb'/>
	</body>
</html>

注意一下:这里的el对应的元素不是div 而是input
fieldLabel 元素在单独使用的时候没有作用,只有在form中起作用
分享到:
评论

相关推荐

    Extjs2.02 Gridpanel

    【EXTJS 2.02 GridPanel 知识详解】 EXTJS GridPanel 是EXTJS库中的核心组件之一,尤其在EXTJS 2.02版本中,它提供了强大的表格展示和交互功能,对于初学者来说极具学习价值。GridPanel不仅能够处理基本的表格操作...

    ExtJS 2.02版本

    ExtJS可以用来开发RIA也即富客户端的AJAX应用,是一个用javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的前端 ajax框架。因此,可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。ExtJs...

    extjs2.02帮助文档

    这个"extjs2.02帮助文档"提供了关于ExtJS 2.0.2版本的详尽指南,它是一个中文完整版,对于开发者来说是学习和理解这一版本ExtJS的重要资源。 在ExtJS 2.0.2中,主要包含了以下关键知识点: 1. **组件系统**:ExtJS...

    ExtJs2.02官方实例aspx(.net)版

    ExtJs2.02官方实例aspx(.net)版

    EXTJS的COMBOBOX级联实现和数据提交VALUE[文].pdf

    EXTJS的ComboBox级联实现是Web应用程序中常见的一种交互方式,尤其在数据表单中用于联动选择。在本文中,我们将深入探讨EXTJS如何实现ComboBox的级联效果,并理解其数据提交VALUE的工作原理。 首先,我们需要创建两...

    extjs4 ComboBox 点击下拉框 出现grid效果

    在EXTJS4中,ComboBox是一个常用的组件,它用于创建下拉选择框,通常用于输入框的辅助选择。这个组件提供了一种用户友好的方式来从一组预定义的选项中进行选择。然而,根据你的标题和描述,你似乎遇到了一个特别的...

    extjs editgrid combobox 回显

    以上代码展示了如何配置`EditGrid`中的`ComboBox`,并使用`renderer`函数实现值的回显。通过遵循这些步骤,你可以确保在用户选择`ComboBox`中的值时,该值能够准确无误地回显到相应的`EditGrid`单元格中,从而提升...

    extJs4 ComboBox组合框实例

    extJs4 ComboBox 代码组合框实例,ComboBox 各个主要参数详细解释

    extjs的ComboBox 2级联动

    ExtJS的ComboBox是一个非常强大的组件,它用于创建下拉选择框。在Web应用程序中,我们经常需要实现二级联动效果,即一个ComboBox的选择会影响另一个ComboBox的显示内容。这在数据关联和筛选场景中尤为常见,例如省份...

    extjs 自动补全 模拟combobox

    EXTJS并没有直接提供一个名为"自动补全"的组件,但它可以通过模拟Combobox组件来实现这一效果。Combobox是EXTJS中的一个下拉选择框,它可以显示一个下拉列表供用户选择,同时也可以配合自动补全功能。 首先,让我们...

    不懂ajax一样做ajax extjs2.02

    这个软件现在市面上只有2.0 和2.1 2,0有些新东西不能用 2.1要钱才能用啊, &lt;br&gt;怕这个东西以后2.02没有了先发个到csdn保存一下, &lt;br&gt;听说网友想在2.02上开发出网友自己的2.1这个目前不敢肯定,但是官方的...

    Ext combobox 下拉多选框带搜索功能

    在IT行业中,Ext JS是一个广泛使用的JavaScript库,用于构建富客户端Web应用程序。它提供了一套丰富的组件,包括各种类型的输入控件,如ComboBox。在给定的标题“Ext ComboBox 下拉多选框带搜索功能”中,我们关注的...

    Extjs中ComboBox加载并赋初值的实现方法

    在Extjs框架中,ComboBox组件是经常使用的组件之一,它允许用户在一个下拉列表中进行选择。当需要在ComboBox加载数据之后为其赋初值,且这个赋值操作需要在数据加载完成后才能进行,以确保用户体验的正确性时,需要...

    ExtJS Combobox二级联动列子

    ExtJS的Combobox组件是一种常见的数据输入控件,它提供了下拉列表的功能,用户可以选择列表中的一个选项或者在输入框中自由输入。在实际应用中,我们常常会遇到需要实现二级甚至多级联动的场景,这通常是由于数据的...

    Extjs让combobox写起来简洁又漂亮

    其中,Extjs的combobox组件是一个常用的UI控件,它集成了文本输入和下拉列表,允许用户在有限的空间内快速选择一个选项。 在Extjs中,创建一个简洁又漂亮的combobox组件主要包括以下几个关键点: 1. 创建自定义...

    extjs3.x combobox智能联想

    8. `transform`:用于指定Combobox的HTML元素ID,这在需要将现有的HTML select元素转换为EXTJS Combobox时使用。 实现智能联想的关键在于编写自定义的查询事件处理函数,通过监听`beforequery`事件,我们可以对用户...

    Extjs6中Combobox实现下拉多选

    该资源主要展示了在Extjs6中Combobox控件实现下拉选择多个数据的功能

    无废话ExtJs 教程十[下拉列表:Combobox]

    通过以上内容,我们可以深入了解ExtJS中Combobox组件的使用和配置,从而在实际项目中灵活地创建满足需求的下拉列表。无论是简单的数据选择还是复杂的动态查询,Combobox都是一个强大且实用的工具。在学习和实践中,...

    Extjs4.0 ComboBox如何实现三级联动

    很多网友在问,Extjs4.0 ComboBox如何实现,好在之前用3.x实现过一个三级联动,如今用Extjs4.0来实现同样的联动效果。其中注意的一点就是,3.x中的model:’local’在Extjs4.0中用queryMode: ‘local’来表示,而且在...

Global site tag (gtag.js) - Google Analytics