var firstStore = new Ext.data.JsonStore({
autoLoad : false,
url : 'getUnderLevelOrgs.action',
root : 'root',
totalProperty : 'totalProperty',
fields : ['id', 'name'],
baseParams : {
start : 0,
limit : 8,
id : 0,
level : 1
}
});
var secondStore = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
url : "getUnderLevelOrgs.action"
}),
reader : new Ext.data.JsonReader({
root : 'root',
totalProperty : 'totalProperty',
id : 'id',
fields : ['id','name']
})
})
var thirdStore = new Ext.data.JsonStore({
url : 'getUnderLevelOrgs.action',
root : 'root',
totalProperty : 'totalProperty',
fields : ['id', 'name']
})
var orgForm = new Ext.form.FormPanel({
title : '维护他人机构',
frame : true,
closable : true,
hideMode : 'offsets',
//constrainHeader : true,
labelAlign : 'right',
items : [{
fieldLabel : '执法人员',
forceSelection : true,
anchor : '80%',
queryDealy : 3000,
selectOnFocus : true,
typeAhead : true,
loadingText : '数据加载中......',
minChars : 0,
pageSize : 10,
minListWidth : 270,
name : 'id',
xtype : 'combo',
hiddenName : 'userId',
valueField : 'userId',
displayField : 'applicationame',
allowBlank : false,
blankText : '请选择人员',
emptyText : '请选择人员',
triggerAction : 'all',
mode : 'local',
store : personStore
},{
fieldLabel : '一级单位',
forceSelection : true,
autoLoad : false,
anchor : '80%',
queryDealy : 3000,
selectOnFocus : true,
typeAhead : true,
loadingText : '数据加载中......',
minChars : 0,
pageSize : 10,
minListWidth : 270,
name : 'firOrg',
xtype : 'combo',
hiddenName : 'id',
valueField : 'id',
displayField : 'name',
allowBlank : false,
blankText : '请选择一级单位',
emptyText : '请选择一级单位',
triggerAction : 'all',
// width : 150,
mode : 'remote',
store : firstStore,
listeners : {
change :function(node){
/*secUrl = 'global/globalAction!getUnderLevelOrgs.action';
secProxy.setUrl(secUrl);*/
secondStore.load({
params : {
start : 0,
limit : 5,
level : 2,
id : node.getValue()
}
});
}
}
},{
fieldLabel : '二级单位',
autoLoad : false,
forceSelection : true,
anchor : '80%',
queryDealy : 3000,
selectOnFocus : true,
typeAhead : true,
loadingText : '数据加载中......',
minChars : 0,
pageSize : 10,
minListWidth : 270,
name : 'secOrg',
xtype : 'combo',
hiddenName : 'id',
valueField : 'id',
displayField : 'name',
blankText : '请选择二级单位',
emptyText : '请选择二级单位',
triggerAction : 'all',
mode : 'local',
editable : false,
store : secondStore,
listeners : {
change : function(node){
thirdStore.load({
params : {
start : 0,
limit : 5,
level : 3,
id : node.getValue()
}
});
}
}
},{
fieldLabel : '三级单位',
autoLoad : false,
forceSelection : true,
anchor : '80%',
queryDealy : 3000,
selectOnFocus : true,
typeAhead : true,
loadingText : '数据加载中......',
minChars : 0,
pageSize : 10,
minListWidth : 270,
name : 'id',
xtype : 'combo',
hiddenName : 'id',
valueField : 'id',
displayField : 'name',
blankText : '请选择三级单位',
emptyText : '请选择三级单位',
triggerAction : 'all',
// width : 150,
mode : 'local',
editable : false,
store : thirdStore
}],
buttons : [{
text : '更新',
handler : function(btn){
}
}]
});
su.orgManager.win = new Ext.Window({
title : '机构维护',
//resizable : false,
layout : 'fit',
width : 350,
closeAction : 'hide',
height : 220,
items : [orgForm]
});
分享到:
相关推荐
在这个特定的项目“Extjs4---combobox省市区三级联动+struts2”中,我们将探讨如何利用ExtJS 4的ComboBox组件实现省市区的三级联动效果,并结合Struts2框架进行数据交互。 首先,`ComboBox`是ExtJS中的一个组件,它...
在本文中,我们将深入探讨如何使用ExtJS 4和Struts2框架实现省市区三级联动的完整示例。这个示例适用于需要在Web应用程序中实现地理区域选择功能的情况,例如用户地址输入。以下是对该技术栈及其实现方法的详细说明...
很多网友在问,Extjs4.0 ComboBox如何实现,好在之前用3.x实现过一个三级联动,如今用Extjs4.0来实现同样的联动效果。其中注意的一点就是,3.x中的model:’local’在Extjs4.0中用queryMode: ‘local’来表示,而且在...
下面我们将详细讨论如何在ExtJS中实现Combobox的二级联动。 一、基础概念 1. Combobox:ExtJS中的Combobox是FormPanel的一个字段,它结合了文本输入框和下拉列表,提供了一种选择或输入数据的方式。 2. 二级联动:...
其中,JSP(JavaServer Pages)页面中的下拉框三级联动功能,是一种常见的需求,用于处理多级分类数据的选择,如国家-省份-城市的选择。本文将深入解析如何在JSP页面中实现下拉框的三级联动功能,以及其背后的实现...
NULL 博文链接:https://ruohanfly.iteye.com/blog/2183068
它提供了在Visual Studio 2010环境下,使用ASP.NET、jQuery和ExtJS三种不同JavaScript框架实现省市区三级联动的DropDownList控件,并通过Ajax技术进行异步数据加载的示例。 首先,ASP.NET是Microsoft提供的一个强大...
本文将深入探讨如何使用ExtJS 3结合MySQL来实现一个省份城市二级联动的前端与后台系统。 首先,ExtJS 3提供了丰富的组件和API,使得开发者可以轻松创建各种复杂的用户界面,如下拉菜单、表格、表单等。在这个案例中...
在实现三级联动时,可以使用ExtJS的ComboBox组件,通过store与远程数据源(servlet)连接,实现数据的动态加载。ExtJS的模型层(Model)、存储层(Store)和视图层(View)设计使数据管理更为规范,同时其丰富的组件...
1整体项目基于WPF的MVVM框架,分为上左中三部分,可伸缩; 2仿Extjs的左菜单,可动态绑定数据集,采用fontawesome作为图片; 3左菜单联动的中间部分的Tab控件,Tab页可关闭。 补充:该项目用vs2012运行。 准备...
在一级、二级、三级联动下拉框中,选择一个选项将影响下一个下拉框的显示内容,提供了一种层次清晰的导航方式。在ExtJS中,这通常通过组合框(ComboBox)组件和数据存储(Store)配合实现。每个级别的下拉框都有自己...
本文主要列举了省市三级联动的DropDownList+Ajax的三种框架(aspnet/Jquery/ExtJs)示例。前段时间需要作一个的Web前端应用,需要用多个框架,一个典型的应用场景是省市三级联动,基于此应用,特将三种主要的ajax框架...
在Ext JS中,可以通过`store.load()`或`store.filter()`方法来加载或过滤子级ComboBox的数据。 例如,假设我们有三个级联的ComboBox:国家、省份和城市。首先,初始化国家的ComboBox,加载所有国家的数据。当用户...
在"ExtJs XML 省市县级联"这个项目中,开发人员利用ExtJs的组件和数据处理能力,结合XML数据格式,实现了中国省市县三级联动的选择效果。这种功能常见于需要用户选择详细地区信息的Web应用中,如物流配送、地址填写...
ExtJS4学习笔记(十六)---Combobox三级联动 ExtJS4学习笔记(十四)--- ComponentQuery ExtJS4学习笔记(四)---Grid的使用 Extjs4开发笔记(三)——菜单的实现 Extjs4开发笔记(二)——框架的搭建 Extjs4开发笔记(五)——...
6. **强大的表单组件**:提供多种表单控件,支持验证、自定义布局和联动效果。 7. **触摸事件支持**:优化了触摸事件处理,提高了在移动设备上的交互体验。 二、引用ExtJS 5.1 1. **引入CSS和JavaScript**:首先,...
5.4.6 创建三级或多级菜单 5.4.7 具有选择框的菜单 第6章 页面元素与模板 6.1 构成用户界面的元素 6.2 获取页面元素 6.3 元素常见的使用方法 6.3.1 常见的“显示/隐藏”方法 6.3.2 常见的“内容控制”方法 ...