var crdtypeStore_CX = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
url : ''
}),
reader : new Ext.data.JsonReader({}, [{
name : 'value'
}, {
name : 'text'
}]),
autoLoad:true
});
var crdtypeCombo_CX = new Ext.form.ComboBox({
name : 'crd_type',
hiddenName : 'crdtype',
fieldLabel : '卡种类',
emptyText : '请选择卡种类...',
triggerAction : 'all',
store : crdtypeStore_CX,
displayField : 'text',
valueField : 'value',
loadingText : '正在加载数据...',
mode : 'remote', // 数据会自动读取,如果设置为local又调用了store.load()则会读取2次;也可以将其设置为local,然后通过store.load()方法来读取
forceSelection : true,
typeAhead : true,
resizable : true,
editable : false,
allowBlank : false, // 是否允许为空
//labelStyle : 'color:red;',
anchor : '95%',
renderer : CARDTYPERender
});
crdtypeCombo_CX.on('select', function() {
crdkindCombo_CX.clearValue();
var value = crdtypeCombo_CX.getValue();
crdkindStore_CX.load({
params : {
crd_type : value
}
});
});
/** ***************定义查询"卡类别"下拉框******************** */
var crdkindStore_CX = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
url : ''
}),
reader : new Ext.data.JsonReader({}, [{
name : 'value'
}, {
name : 'text'
}]),
autoLoad:true
});
var crdkindCombo_CX = new Ext.form.ComboBox({
name : 'crd_kind',
hiddenName : 'crdkind',
fieldLabel : '卡类别',
emptyText : '请选择卡类别...',
triggerAction : 'all',
store : crdkindStore_CX,
displayField : 'text',
valueField : 'value',
loadingText : '正在加载数据...',
mode : 'local', // 数据会自动读取,如果设置为local又调用了store.load()则会读取2次;也可以将其设置为local,然后通过store.load()方法来读取
forceSelection : true,
typeAhead : true,
resizable : false,
editable : false,
allowBlank : false, // 是否允许为空
//labelStyle : 'color:red;',
anchor : '95%'
});
crdkindCombo_CX.on('select', function() {
var value = crdkindCombo_CX.getValue();
});
修改窗体打开时调用:crdtypeStore_CX.on("load", function(crdtypeStore_CX, records, option) {
for(i = 0; i < records.length; i++) {
if(records[i].data.checked == true) {
crdtypeCombo_CX.setValue(records[i].data.value);
} }
});
分享到:
相关推荐
该资源主要展示了在Extjs6中Combobox控件实现下拉选择多个数据的功能
在EXTJS4中,`ComboBox` 是一个非常常用的组件,它提供了一个下拉选择框的功能。在某些场景下,我们可能需要在下拉菜单中展示更丰富的信息,比如表格数据,这时就可以使用 `GridComboBox`。`GridComboBox` 结合了 `...
本篇我们将深入探讨“Extjs之旅”中的一个关键组件——Combox(组合框),特别是其远程加载数据的特性。 Combox在ExtJS中是一个非常灵活的控件,它可以看作是下拉列表和文本输入框的结合体,用户可以输入文本搜索,...
ExtJS4中的ComboxTree是一种将下拉列表与树形结构结合的组件,它扩展了标准的ComboBox,提供了更丰富的用户交互体验。这种组件在数据展示和选择时特别有用,尤其是在处理具有层级关系的数据时,比如部门结构、地区...
在Extjs框架中,ComboBox组件是经常使用的组件之一,它允许用户在一个下拉列表中进行选择。当需要在ComboBox加载数据之后为其赋初值,且这个赋值操作需要在数据加载完成后才能进行,以确保用户体验的正确性时,需要...
在ExtJS中,PropertyGrid是一种用于展示对象属性的控件,它可以方便地编辑和查看对象的各个属性。在PropertyGrid中遇到的一个常见问题是当使用Combobox(下拉列表框)作为编辑器时,用户选择的值(displayField)与...
在EXTJS中,创建一个具有特定功能的表单通常涉及到多个组件的组合使用,如文本框、下拉列表以及事件监听。在这个例子中,我们看到一个EXTJS的表单面板`Ext.FormPanel`被用来展示一个包含文本框、下拉列表和标签的...
在本文中,我们将深入探讨如何使用ExtJS4框架为Combobox控件设置列表中的默认值。ExtJS4是一个广泛使用的JavaScript框架,专门用于创建富互联网应用(RIA)。它提供了丰富的组件和接口,以帮助开发者构建具有高度...
Extjs 下拉菜单实现拼音输入进行检索
ExtJS 是一个流行的JavaScript库,用于构建富客户端的Web应用程序。在ExtJS中,`Ext.form.field.ComboBox`(简称ComboBox)是一种常用的控件,它提供了一个下拉列表,用户可以在其中选择一个或多个项目。这个控件在...
这种控件的实现主要依赖于前端框架和库,如JavaScript的jQuery、Vue.js、React.js,以及后端技术如Java的Swing、JQuery UI、ExtJS等。 在JavaScript中,例如使用jQuery UI,可以利用`selectmenu`插件来实现类似的...
从页面布局和使用的控件TextBox,Combox,Button,ToolBar,StateBar,Panel,TabPanel,ExplorerBar,MenuBar,PictureBox都用统一的样式非常方便的配置,基本不需要额外美工处理,同时支持ajax无刷新效果。
本文将深入探讨如何在ExtJS 4.1环境中利用MVC架构实现一个功能丰富的下拉框(Tree ComboBox),并结合具体代码示例进行详细解析。 ### ExtJS 4.1 下拉框Tree实现(MVC) #### 1. MVC架构简介 MVC,即Model-View-...
EXTJS是一种基于JavaScript的开源富客户端框架,用于构建桌面级的Web应用程序。它提供了一套完整的组件库,其中包括COMBOBOX(下拉框)组件,该组件在许多数据选择场景中非常常见。"EXT中COMBOBOX联动"指的是在EXTJS...
### Ext JS 中将 Grid 渲染到 ComboBox 的方法 在 Ext JS 框架中,有时需要将 Grid 控件的数据渲染到 ComboBox 中,这在实际应用中是非常实用且灵活的功能。下面将详细介绍如何利用 Ext JS 的 XTemplate 特性来实现...
从页面布局和使用的控件TextBox,Combox,Button,ToolBar,StateBar,Panel,TabPanel,ExplorerBar,MenuBar,PictureBox都用统一的样式非常方便的配置,基本不需要额外美工处理,同时支持ajax无刷新效果。...
在前端开发中,ExtJS是一个流行的JavaScript框架,用于构建富互联网应用程序。其中,级联菜单是一种常见的用户界面组件,允许用户从一个下拉列表中选择一个选项来更新另一个下拉列表的选项。在这个过程中,设置...
本方法和用checkbox, listbox等控件和事件拼凑出来的不同,本方法是一个集成的独立控件,基本实现了控件的顺滑度,下拉框可悬浮等效果,可以认为是comboBox的升级版,使用方便,仅需引用编译好的DLL,直接在toolBox...
2.5、ExtJs中的对话框与Combox组件 2.6、ExtJs中的ExtTree详解 3、ExtJs数据篇 3.1、数据存储基本单元Record与DataField详解 3.2、数据存储Store详解1 3.3、数据存储Store详解2 3.4、数据代理DataProxy详解 ...