`
badmanisme
  • 浏览: 31939 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

联动下拉菜单实例

 
阅读更多
联动下拉菜单核心代码的是线路combo监听器的实现,虽然看着少,但是花了我2天的时间,希望大家少走冤枉路!

// 所有线路的store
var lineNameComboBoxStore = new Ext.data.JsonStore({
url : context + '/equipment/findAllLine.action',
root : 'data',
autoLoad : true,
fields : [{
name : 'sno'
}, {
name : 'chineseName'
}]
});
// 所有车站的store
var stationNameComboBoxStore = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
method : 'Get',
url : context + '/equipment/findAllStation.action'
}),
reader : new Ext.data.JsonReader({
root : 'data'
}, [{
name : 'sno'
}, {
name : 'chineseName'
}])

});
// 显示车站名下拉框
var stationNameField = new Ext.form.ComboBox({
hiddenName : 'equipment.station.chineseName',
store : stationNameComboBoxStore,
emptyText : '请选择',
triggerAction : 'all',
valueField : 'chineseName',
displayField : 'chineseName',
mode : 'remote',
fieldLabel : '车站名称',
id : 'stationName',
allowBlank : true,
width : 120
});
// 显示线路名下拉框
var lineNameField = new Ext.form.ComboBox({
hiddenName : 'equipment.id.sno',
store : lineNameComboBoxStore,
emptyText : '请选择',
triggerAction : 'all',
valueField : 'sno',
displayField : 'chineseName',
mode : 'remote',
fieldLabel : '线路名称',
id : 'lineName',
allowBlank : true,
width : 120,
listeners : {
select : function(combo, record) {
stationNameField.store.proxy = new Ext.data.HttpProxy({
url : context
+ '/equipment/findAllStation.action?parentNo='
+ Ext.getCmp('lineName').getValue()
});
stationNameComboBoxStore.load();
}
}
});

分享到:
评论

相关推荐

    二级联动下拉菜单实例

    以下是对二级联动下拉菜单实例的详细解释和相关知识点: 一、二级联动的概念 二级联动下拉菜单是指一个下拉菜单的选择会影响到另一个下拉菜单的显示内容。通常,第一个下拉菜单(一级菜单)包含了大类选项,用户...

    多款多级联动下拉菜单打包!必有一款适合你!

    标题中的“多款多级联动下拉菜单打包!必有一款适合你!”表明这是一个集合了多种实现多级联动下拉菜单技术的资源包,适用于不同的项目需求和开发环境。这样的菜单通常用于网站导航或者表单中,使得用户可以通过选择一...

    ASP四级联动下拉菜单 (XML+Access)

    ASP 加数据库 四级菜单联动 <!--#include file="adoconn.asp"--> var m_oXMLDoc = new ActiveXObject("Microsoft.XMLDOM"); var m_sBaseSrc = "Tree.asp?ParentCode="; //源码爱好者(http://www.codefans.net) ...

    jQuery插件cxSelect多级联动下拉菜单实例解析

    《jQuery插件cxSelect多级联动下拉菜单实例解析》 在现代网页开发中,多级联动下拉菜单已经成为一种常见的交互方式,特别是在电商网站中,例如地址选择、商品分类等场景。jQuery插件cxSelect就是专为此设计的一款...

    最简单js代码实现select二级联动下拉菜单

    本文实例为大家分享了js实现select二级联动下拉菜单,供大家参考,具体内容如下 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath()...

    jQuery+PHP+MySQL二级联动下拉菜单实例讲解

    二级联动下拉菜单选择应用在在很多地方,比如说省市下拉联动,商品大小类下拉选择联动。本文将通过实例讲解使用jQuery+PHP+MySQL来实现大小分类二级下拉联动效果。 实现效果:当选择大类时,小类下拉框里的选项内容...

    EXCEL带箭头联动二级下拉菜单实例

    EXCEL带箭头下拉菜单实例,教你怎么在EXCEL里做出可以联动的二级下拉框,并且可以一直显示下拉箭头。

    ASP实例开发源码-ASP四级联动下拉菜单 (XML+Access).zip

    ASP实例开发源码—ASP四级联动下拉菜单 (XML+Access).zip ASP实例开发源码—ASP四级联动下拉菜单 (XML+Access).zip ASP实例开发源码—ASP四级联动下拉菜单 (XML+Access).zip

    基于ASP的四级联动下拉菜单 (XML+Access).zip

    综上所述,"基于ASP的四级联动下拉菜单 (XML+Access)"项目涵盖了服务器端脚本、结构化数据处理和关系型数据库的使用,是一个典型的前后端交互的Web开发实例。通过理解和掌握这些技术,开发者可以创建更丰富的交互式...

    AjaxPro无刷新三级联动下拉菜单.rar

    【AjaxPro无刷新三级联动下拉菜单】是一个基于AJAX技术、C#编程语言和SQL数据库实现的功能示例,主要用于创建交互性强、用户体验良好的网页应用。这个示例中,通过AjaxPro库实现了页面的无刷新更新,即在用户选择一...

    简单的二级联动菜单例题

    一个很简单的二级联动下拉菜单实例,一看就懂

    jQuery手机端三级联动下拉菜单特效.zip

    总的来说,这个压缩包提供了一个关于如何在手机端使用jQuery实现三级联动下拉菜单的实例,对于学习和实践jQuery特效和交互设计是非常有价值的。无论是初学者还是有经验的开发者,都能从中受益,进一步提升自己的前端...

    asp如何实现动态下拉菜单赋值给文本框

    本文将详细探讨ASP中如何实现动态下拉菜单赋值给文本框的两种方法,这在构建用户友好的界面时非常有用。 ### 方法一:使用JavaScript 首先介绍的是通过JavaScript来实现动态下拉菜单赋值给文本框的方式。这种方法...

    java联动菜单实例详解

    在Java编程中,联动菜单(通常称为级联菜单或下拉树菜单)是一种常见的用户界面元素,它允许用户从多个相关选项中进行选择,这些选项按照层次结构组织。本篇文章将深入探讨Java实现联动菜单的概念、设计以及相关技术...

    Excel 多级联动下拉列表.xlsm

    Excel 多级联动下拉列表实例

    jsp+ajax 三级联动菜单

    【jsp+ajax 三级联动菜单】是一个典型的Web开发技术应用场景,它主要利用JavaServer Pages(JSP)和Asynchronous JavaScript and XML(AJAX)来实现动态网页中的数据交互和页面更新。在这个例子中,我们看到的是一个...

    jQuery全国高校三级联动下拉选择菜单代码

    总的来说,"jQuery全国高校三级联动下拉选择菜单代码" 是一个实用的前端开发实例,展示了如何结合HTML、CSS和jQuery来创建动态交互的用户界面。通过这种方式,用户可以更有效地从大量的信息中筛选出所需内容,提升了...

    JS实现经典的中国地区三级联动下拉菜单功能实例【测试可用】

    在中国的Web开发中,经常会遇到一个常见的需求,那就是实现地区选择的三级联动下拉菜单,例如选择省份、城市和区县。这样的功能可以方便用户快速定位到他们所在的地理位置。本实例将详细介绍如何使用JavaScript(JS...

Global site tag (gtag.js) - Google Analytics