ExtJS2.2树的级联选择

关于extjs的下拉框二级联动 最近新接触的extjs,需要写下拉框,实现城市与所在街道的联动。用了两种方法。一种是应用filterBy方法 ,另一种是应用store的proxy直接查找。数据量大的时候使用第二种方法。 阅读详情

在做项目的时候要用到树的级联选择,在我的影响中貌似ExtJs 2.2没有自带的级联选择。然后就有了下面的代码:

tree.on('checkchange',function(node,checked){
	selParent(node,checked);
	selChild(node,checked);
},tree);
//这个方法是选择父节点,自动选中所有的子节点
function selParent(node,checked){

	if (node.hasChildNodes()) { 
		node.eachChild(function(child) { 
			child.attributes.checked = checked; 
			var cb = child.ui.checkbox; 
			if (cb){
				cb.checked = checked;
				selParent(child, checked); 
			}
		}); 
	} 

}
//这个方法是选择子节点,自动选中父节点的父节点 
function selChild(node, checked){
	if(checked){
		var parentNode = node.parentNode;
		if(parentNode != undefined){
			parentNode.attributes.checked = checked; 
			var cb = parentNode.ui.checkbox; 
			if(cb){
				cb.checked = checked;
				selChild(parentNode, checked);
			}
		}
	}else{
		var flag = false;
		if(node == null){
			return;
		}
		var parentNode = node.parentNode;
		if(parentNode != undefined){
			if(parentNode.hasChildNodes()){
				parentNode.eachChild(function(child){
					var cd = child.attributes.checked;
					if(cd == true){
						flag = true;
					}
				});
			}
		}
		if(!flag){
			parentNode.attributes.checked = checked;
			var cb = parentNode.ui.checkbox;
			if(cb){
				cb.checked = checked;
				selChild(parentNode, checked);
			}
		}
	}
}


实现ExtJS TreePanel复选框的级联选择功能 ExtJS是由Sencha公司开发的一款成熟的JavaScript框架,以其丰富的组件库和数据处理能力在前端开发领域占有重要地位。本章将重点介绍ExtJS框架中的TreePanel组件,它是一个用于展示层级化数据的界面元素,能够模拟现实中的树状结构,非常适合用在需要展示文件系统、组织架构等层级信息的场景中。TreePanel组件的核心功能包括了节点的动态加载、展开和收缩,以及节点间的基本交互操作。它通过可配置的视图和事件机制,为用户提供了一个直观且功能丰富的数据展示界面。 阅读详情

相关推荐

EXTJS4 组件实战:树、Grid、表单与查询功能开发

本文还有配套的精品资源,点击获取 简介:EXTJS4提供了一系列组件,如树、网格、表单和查询,以构建交互式Web应用程序。本教程将详细讲解如何实现这些组件,包括树的动态加载与交互、网格的数据操作与插件应用、表单的字段类型与验证,以及查询功能的过滤和搜索。实际案例将展示如何综合运用这些组件,创建如图书管理系统等企业级应用,强调理解EXTJS的MVC架构及组件定制化的重要性。 ...

weixin_30415591的博客 1251

栏目 右键克隆 栏目树调整顺序 遮罩层

遮罩层 #pageOverlay { position:fixed; top:0; left:0; z-index:1987; width:100%; height:100%;  background:#000; filter:alpha(opacity=50); opacity:0.50; } function layerMaskShow() {       docum

okkeqin的专栏 1670

GEO优化实战:用AnswerBit量化AI搜索可见度与品牌监控体系

生成式引擎优化(GEO)正取代传统SEO,成为品牌在AI搜索生态中获取可见度的关键。当用户习惯从“翻列表”转向“直接问AI”,品牌能否被生成式引擎识别、引用并正向推荐,直接决定了其在用户决策链条中的存在感。AI搜索可见度因此从模糊概念演变为可度量的运营指标,涵盖提及率、引文率、情感分与回源质量等维度。腾讯AnswerBit作为答案侧分析工具,帮助运营者拆解AI回复中的品牌语境与引用来源,让优化动作有据可循。从内容结构化改造、品牌实体建设到第三方权威背书,GEO要求团队建立“度量-优化-再度量”的闭环。文章结

weixin_31100517的博客 150

ExtJS 复选框的tree 结点的级联选择

//判断是否有子结点被选中 var childHasChecked = function(node) { var childNodes = node.childNodes; if(childNodes || childNodes.length>0){ for(var i=0;i<childNodes.length;i++

3月3的风筝 2200

win11一直弹出用户账户控制怎么解决

用户帐户控制简称UAC,是微软公司在其Windows Vista及更高版本操作系统中采用的一种控制机制。近期有部分Win11用户想要关闭UAC,但是不知道应该如何操作,对此下面我就教给大家操作方法,大家可以去尝试看看。...

xitongzhijia_abc的博客 5万+

告别Quartus II的漫长等待:用VSCode+iverilog+GTKWave搭建你的轻量级Verilog仿真环境(2024保姆级教程)

本文详细介绍了如何利用VSCode、iverilog和GTKWave构建高效的Verilog/SystemVerilog开发环境,替代传统的Quartus II和ModelSim工具。通过2024年最新的保姆级教程,帮助开发者实现秒级启动、低资源消耗的轻量级仿真环境,显著提升数字电路设计的开发效率和调试体验。

weixin_33690963的博客 561

extjs treepanel的ctrl、shift多选、连选功能实现

最近需要实现一个树的多选连选功能,但发现extjs的多选模型MultiSelectionModel只提供了类似ctrl的多选功能,并没有提供shift连选的功能。 网上也没有关于实现此功能的例子,于是自己重写了onNodeClick方法,供大家参考。 // 存放第一次点击的节点id var node1 = null; var mst=new Ext.tree.MultiSelectionMo

小雷的博客 2737

相机标定-机器视觉基础(理论推导、Halcon和OpenCV相机标定)

相机标定是获得目标工件精准坐标信息的基础。首先,必须进行相机内参标定,构建一个模型消除图像畸变;其次,需要对相机和机器人的映射关系进行手眼标定,构建一个模型将图像坐标系上的点映射到世界坐标系。主要分为背景知识、相机内外参模型推导、编程代码实现三个部分。

beyond951的博客 7301

eXtjs4下拉树支持单选复选级联选择 [复制链接]

效果图.不带checked的json数据格式只支持单选带jchecked的json数据的单选带checked的json数据的多选,可支持级联操作,级联分为级联父节点,级联子节点,两者都级联封装基类代码:comboxtree.js[html]view plaincopyExt.define("Ext.ux.comboboxtree", { extend: "Ext.f...

weixin_33979203的博客 167

OneOS远程升级能力实操演示 | OTA升级

OneOS远程升级能力实操演示,差分算法提升效率,OTA升级,OTA差分算法,全量升级、压缩升级、差分升级,有线网络连接,bootloader,升级平台,在线差分包制作,触摸屏以及GUI图形操作

OneOS是中国移动针对物联网领域推出的轻量级操作系统 2011

立创·庐山派-K230-CanMV(嘉楠勘智)开发板通过ATK-ESP8266实现图像识别数据无线传输至原子云

本文详细介绍了如何使用立创·庐山派-K230-CanMV开发板,通过ATK-ESP8266 WIFI模块实现图像识别数据的无线传输至原子云平台。内容包括硬件连接、软件环境搭建、AT指令控制、原子云连接及数据上传的全过程,并提供了实用的调试技巧和常见问题解决方案,为物联网应用开发提供了完整实践指南。

potato的博客 741

ExtJS 树形结构的级联选择

[code="js"] tree.on('checkchange', function(node, checked) { selParent(node, checked); selChild(node, checked); }, tree); //这个方法是选择父节点,自动选中所有的子节点 function selParent(n...

iteye_18684的博客 237

让 ME51N 在采购信息记录过期时不要带出上一次采购订单的价格

在采购信息记录(PIR)价格条件无效或过期时,到上一次采购订单价格进行提议;你可以通过关闭,并在把PO price设置为不采纳,再辅以把过期的价格来源直接拦截为错误。若仍需 100% 阻断,可用在保存前清空估价价格作为技术兜底。标准行为与配置证据见文内引用。

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 655

AI生成本地跑:Copilot+MCP打造稳定自动化测试实战

自动化测试是软件质量保障的核心环节,然而AI生成的测试代码常因选择器过期、弹窗遮挡等问题无法直接落地。本文从自动化测试基础原理出发,讲解如何利用Copilot将自然语言需求翻译为测试脚本,再通过MCP协议驱动真实浏览器执行,形成“AI翻译、MCP驾驶、本地运行”的高效闭环。方案覆盖环境配置、非预期弹窗动态处理、超时与幻觉断言排查等工程实践,帮助测试团队在无需云端服务的情况下,实现稳定可复用的UI回归与接口冒烟测试。适合正在探索AI辅助测试落地的研发与测试人员参考。

weixin_33978044的博客 144

实战交易策略 篇二十二:情绪流龙头交易策略

在股票市场中,机构主导趋势,游资驱动热点,散户易被情绪裹挟,形成“金字塔”式生态链,并存在情绪传递、强者恒强、物极必反的规律特点。股市是资金驱动的情绪博弈场,价格波动由群体心理、资金博弈和预期差共同驱动,核心是资本逐利性与人性贪婪恐惧的交织,兼具资源配置、财富再分配与风险定价功能。涨停加速与逃逸缺口(主升强化)凹字板/平台突破(趋势延续)天量弱转强(分歧买点)不参与首波(二波策略)情绪周期(道术合一)主线思维(聚焦核心)开盘抢筹(竞价博弈)一字助攻(情绪强化)分批进出(滚动操作)

生活在别处 1487

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

ExtJs6 TreeGrid(级联选择树)

ExtJs6 TreeGrid var treeGrid = Ext.create("Ext.tree.Panel", { flex: 1, store: { type: 'tree', fields: ['Name', 'ID', 'Type'] }, id: 'teleTreeGrid', useArrow...

seasidexin的专栏 1272

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

ExtJs选择框级联

ExtJS TreeGrid 添加监听事件 <Listeners> <Listener name="checkchange" function="checkLink"/> </Listeners> 两种方法处理级联 第一种 function checkLink (node, checked) { cascade_childnode(node, checked); } // 树形选择:级联选中下级 function cascade_childnode(no

daring_xiaowang的博客 478

Statistics and Machine Learning Toolbox

Statistics and Machine Learning Toolbox(带书签),MATLAB统计学习工具

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

extjs中 combobox级联

1、首先定义storeJs代码//**测试下拉框级联**   var storedm = new Ext.data.Store({   //队名称下拉框        proxy: new Ext.data.HttpProxy({               url: ../servlet/CommonMethod?command=getdm 

EasyJS 一个简单的JS框架 2549

ExtJs checkbox树

var Tree_Dept; var Tree_Dept_Loader; var checkchange = false; Ext.onReady(function() { Ext.BLANK_IMAGE_URL = '/js/extjs/resources/images/default/s.gif'; //级联选择设...

zlq636785的专栏 210

ExtJS 省、市、县 级联 示例

ExtJS 省、市、县级联示例 1.程序代码清单: Test var dataProvince = [ ['河北', '河北'], ['内蒙古', '内蒙古'] ]; var dataCityHebei = [ ['唐山', '唐山'], ['秦皇岛', '秦皇岛']

TKD03072010的专栏 4355

extjs tree check 级联选择

extjs4 tree check 级联选择 实现效果:关键代码: function changeAllNode(node, isCheck) { allChild(node, isCheck); allParent(node, isCheck); function allChild(nodec, isCheckc) { var chileNodes = n

LinBSoft的专栏 2469

ExtJS树的选择操作

//树 var treePanel = new Ext.tree.TreePanel({ id:'ptree', region:'west', layout:'anchor', border:false, rootVisible: false, root:{}, listeners:{ render: function() { authorityTree(t

XT先生 711

extjs实现级联以及节点的模糊查询

Ext.tree.TreeCheckNodeUI 前面是通过这个组件实现的父节点和子节点的级联 但是源码貌似很复杂个人认为,因此不需要通过这个组件实现. 通过以下这两个函数实现类似的功能.  visitAllTreeNodeFun(node, checked);            if (node.parentNode &amp;&amp; node.parentNode.getU...

gt2008gt的博客 304

ExtJs 在gridPanel中每一行内combobox的二级联动

ExtJs 在gridPanel中每一行内combobox的二级联动 前置 extjs版本 3.X 前端没有html代码,都是由extjs写就,最后渲染而成 需求 一个gridPanel中的每一行都有两列是combobox,这两个combobox是联动的,且行与行之间不应该相互影响 效果如图,显示的是第一级combobox 初始解决方法 为第一个combobox添加“select”事件,将选...

qq_35234003的博客 849

ExtJs combo的二级联动

二级联动主要是监听一级下拉框的取值,然后将该值作为二级下拉框请求数据时参数。下拉框和其对应的数据源都进行单独定义

执子之手 649

下拉列表的二级联动(ExtJs)

//下面的方法是创建一个下拉列表的二级联动组件,并扔到原先的面板中expansion : function(cfg){ var typeCombStore = new Ext.data.JsonStore({     //一级列表数据 fields : ['value', 'text'], data : [{ 'value' : 1, 'text' : '一类...

nerveboy学习笔记 1865
上一篇: spring3.1.x源码编译并导入eclipse
下一篇: Cannot change version of project fact Dynamic Web Module to 3.0解决方法
HingKwan
博客等级 码龄17年 51粉丝 86原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值