一，重要属性
fieldLabel: 框名,所在的面板必须是layout:'form'才能显现
hiddenName:'snCompare', //真正提交时此combo的Name
triggerAction:'all', //默认为query，每次下列均显示全部显示，而不是部分
editable:false, //不可编辑
valueField:'value', //value字段,通过hiddenName来传递
displayField:'text', //显示文本字段
mode:'local', //本地加载，才能加载数据 'remote'远程加载
store:new Ext.data.SimpleStore({ //存储静态数据的写法
data:[['like', '相似'],
['nequal', '不等于'],
['eq', '等于']],
fields:['value','text'] }) //字段与上面对应
二，
例子一，
//combobox_01.js页面
Ext.onReady(function(){
var formStore = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'comboboxform_01.jsp'}),
reader:new Ext.data.JsonReader({root:'root'},['value','text'])
});
formStore.load();
var formCombo = new Ext.form.ComboBox({
hiddenName:'comboboxtest',
store:formStore,
valueField:'value',
displayField:'text',
typeAhead:true,
mode:'local',
triggerAction:'all',
emptyText:'请选择表单名',
selectOnFocus:true,
renderTo:Ext.getBody() //若渲染在其他表单中就可以不用写
});
});
//上述js可以改造成远程的
//注释掉 formStore.load()和 mode:'local'，而将mode:'local'改为 mode:'remote'
//comboboxform_01.jsp页面
<html>
<body>
<%
String data="{root:[{value:'value123',text:'text123'}]}"; //value和text可以有引号
try{
response.getWriter().write(data);
response.getWriter().close();
}catch(Exception e){
e.printStackTrace();
}
%>
</body>
</html>
例子二
对上述例子一的改造
json数据可以这样写
String json= "[{vale:'value123',text:'text123'},{},{}]";
这样解析数据就可以写成与它对应的格式
reader:new Ext.data.JsonReader({},['value','text']) //注意是二维的
//combobox_02.js页面
Ext.onReady(function(){
var formStore = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'comboboxform_02.jsp'}),
reader:new Ext.data.JsonReader({},['value','text'])
});
var formCombo = new Ext.form.ComboBox({
store:formStore,
hiddenName:'combotest',
valueField:'value',
displayField:'text',
typeAhead:true,
mode:'remote',
triggerAction:'all',
emptyText:'请选择表单名',
selectOnFocus:true,
renderTo:Ext.getBody() //若渲染在其他表单中就可以不用写
});
});
//comboboxform_02.jsp页面
<html>
<body>
<%
String data="[{value:'value123',text:'text123'}]"; //value和text可以有引号
try{
response.getWriter().write(data);
response.getWriter().close();
}catch(Exception e){
e.printStackTrace();
}
%>
</body>
</html>
例子三，当combobox作为容器的一个元件时的写法如下
此时就没有renderTo，而且在编写js的页面时，此时的js相对地址就是在调用该js的页面地址，所以url的编写地址要注意，在哪个层面上调用
//js页面
new Ext.form.ComboBox({
mode:'remote',triggerAction:'all',
valueField:'value',displayField:'text',
hiddenName:'sourceCompare',
store:new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'../test/test.jsp'}),
reader:new Ext.data.JsonReader({},['value','text'])
})
});
//url的相对于位置是与调用该js的页面为参照物，个人见解
//json数据返回页面
<html>
<body>
<%
String data="[{'value':'value123','text':'text123'}]"; //value,text双引号可以省略掉
try{
response.getWriter().write(data);
response.getWriter().close();
}catch(Exception e){
e.printStackTrace();
}
%>
</body>
</html>
注意：
调用后，传递的是value数据，而不是text数据，所以有时采用取巧的方法，将value和text的取值一样
分享到：
相关推荐
本篇学习笔记将深入探讨EXTJS中ComboBox的联动效果，即一个ComboBox的选择会触发另一个ComboBox的数据更新，以此来提供更丰富的交互体验。通过源码解析和工具应用，我们将了解如何构建和实现这种联动效果。 ...
### LabVIEW学习笔记知识点梳理 #### 一、调试技巧与数据监测 - **探针工具**: 在调试过程中，可以通过右键菜单中的`probe`和`custom probe`功能来设置探针，用于实时监测数据流。这有助于理解数据如何在各个节点...
【VB例子+学习笔记】是一份综合性的学习资源，旨在帮助初学者和有一定基础的程序员深入理解Visual Basic（VB）编程语言。这份资料包含了85个精心挑选的经典VB实例，覆盖了VB的基础语法、控件使用、事件处理、数据...
ComboBox控件可以输入文本也可以提供列表来选择项，而且还自带有属性来实现自动匹配，但是它有一个弊端，只能从头开始匹配，例如"张三丰"，输入"三"或“三丰”是匹配不了。该自定义控件利用visual studio2017开发，...
根据提供的信息，我们可以总结出以下关于Flex学习笔记中的关键技术知识点： ### 1. Flex 基础设置 在Flex开发中，通常会涉及到基础样式的设置。例如，在给定的部分内容中提到了字体大小、颜色及背景色的设置。虽然...
### ObjectDCL学习笔记（2） #### 一、概述 ObjectDCL是AutoCAD Visual Lisp扩展库中的一个重要组成部分，主要用于创建交互式对话框界面。它提供了丰富的控件库以及便捷的属性设置与事件处理机制，使得开发人员...
**jQuery EasyUI 学习笔记珍藏版** jQuery EasyUI 是一个基于 jQuery 的前端框架，它为开发者提供了丰富的UI组件，使得构建用户界面变得更加简单高效。这个珍藏版的学习笔记涵盖了广泛的jQuery EasyUI主题，旨在...
在这个"easyui学习笔记（十三）源码"中，我们可以期待深入理解EasyUI的一些关键概念和技术。 首先，EasyUI 的组件系统是其强大之处。组件包括表格（datagrid）、对话框（dialog）、菜单（menu）、下拉框（combobox...
这份学习笔记主要涵盖了C#的基础知识，并且特别强调了语法和控件的使用，这都是C#编程的核心部分。以下是对这些知识点的详细阐述： 一、C#语法 C#是一种面向对象的编程语言，它的语法结构清晰，易于理解。基础语法...
DirectSound是微软DirectX的一部分，是一个用于音频处理的SDK开发库，特别适合于游戏和多媒体应用中的音频播放和采集。...通过深入学习DirectSound，开发者能够创建更高级的音频处理功能，如声音混音、3D音效等。
Visual Basic 6.0是微软开发的一种编程环境，主要用于创建Windows...以上是Visual Basic 6.0学习笔记的关键点，涵盖了基础语法、编程结构和控件使用等多个方面。了解并掌握这些知识点，将有助于构建和维护VB6应用程序。
ExtJS4学习笔记(十六)---Combobox三级联动 ExtJS4学习笔记(十四)--- ComponentQuery ExtJS4学习笔记(四)---Grid的使用 Extjs4开发笔记(三)——菜单的实现 Extjs4开发笔记(二)——框架的搭建 Extjs4开发笔记(五)——...
这个"VB85个例子+学习笔记"的压缩包很可能是为了帮助初学者或有经验的开发者深入理解VB语言的关键概念和实际应用。下面我们将详细探讨其中可能涵盖的知识点。 1. **基础语法**：VB的基础语法包括变量声明、数据类型...
您可以在几分钟内编写一段 Python脚本和让桌面拥有令人难以置信的相当漂亮的 GUI应用程序。这篇文章向您展示如何使用一 Python-著称的 GUI 库wxPython，来做到这一点的。向您的朋友和邻居介绍！...
它以其高效、直观的可视化组件库闻名，其中包含了各种控件，如列表框(ListBox)和组合框(ComboBox)。 列表框(ListBox)是Delphi中常见的控件，用于展示一系列可供用户选择的项目。以下是关于列表框的一些关键知识点：...
Python 界面库 tkinter 学习笔记 tkinter 是 Python 的标准 GUI 库，提供了一个强大的工具来创建图形用户界面。下面是 tkinter 的一些基础知识点： 1. 基本概念 tkinter 版本可以通过 import tkinter print...
在本篇JQueryEasyUI的学习笔记中，我们将深入探讨如何利用这个强大的JavaScript库来实现一些常见的数据操作功能，包括批量删除、行内编辑以及自定义编辑器方法。JQueryEasyUI是一个基于jQuery的UI框架，它提供了一...
在实际项目中，你可以根据这个文件学习和参考，以便更好地理解和应用上述知识点。 总的来说，将`ComboBox`嵌入到`DataGridView`中，不仅丰富了用户界面，也提高了数据输入的准确性和一致性。通过熟练掌握这一技巧，...
### Win8学习笔记知识点概述 本篇学习笔记主要聚焦于Win8开发中常见的UI控件与相关属性的应用，包括但不限于控件的基本使用方法、样式调整、事件触发等关键知识点。通过对这些控件及其特性的深入理解，可以帮助...
本文将深入探讨tkinter库的学习笔记，涵盖基本概念、控件布局、常见控件的特征属性、事件响应以及更高级的应用，如添加背景图片和利用摄像头。 一、图形化界面设计的基本理解 GUI设计的核心在于通过图形元素与用户...