2008-02-20
基于ext2.0的含有checkBox的tree
评论
aiwobucuo
2008-06-28
你的JSON数据组是怎么样生成的啊
c_mingze@163.com
2008-06-15
我也写了一个复选框的树
但是我想 知道怎么实现、特定情况下把页面变成灰色 就是不可以对chenked 或是当前这棵树进行操作。
但是我想 知道怎么实现、特定情况下把页面变成灰色 就是不可以对chenked 或是当前这棵树进行操作。
小蚯蚓
2008-03-19
smellcode 写道
引用
mercuryzhang:看你给的连接，只指出了一个方法。不知道checkboxtree的实现和普通的tree的实现有啥区别，能不能把这个发出来看看啊
你其实可以用最简单的树来实现，不用什么extend<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Reorder TreePanel</title>
<link rel="stylesheet" type="text/css" href="../../../support/resources/css/ext-all.css" />
<script type="text/javascript" src="../../../support/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../../support/js/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = "../../../support/resources/images/default/s.gif"
var tree = null;
Ext.onReady(function(){
// shorthand
var Tree = Ext.tree;
tree = new Tree.TreePanel({
el:'tree-div',
autoScroll:true,
animate:true,
enableDD:true,
containerScroll: true,
loader: new Tree.TreeLoader({
dataUrl:'xmmapjson.json'
}),
rootVisible: false
});
tree.on('checkchange', function(node, checked) {
node.expand();
node.attributes.checked = checked;
node.eachChild(function(child) {
child.ui.toggleCheck(checked);
child.attributes.checked = checked;
child.fireEvent('checkchange', child, checked);
});
}, tree);
// set the root node
var root = new Tree.AsyncTreeNode({
text: 'root',
draggable:false,
id:'root'
});
tree.setRootNode(root);
// render the tree
tree.render();
root.expand();
});
var fn = function() {
alert(tree.getChecked('id'));
};
</script>
</head>
<body scroll="no">
<b>Checked Nodes: </b> <input type="text" id="cn" value="" size="40" autocomplete="off" /><br />
<div id="tree-div" style="overflow:auto; height:300px;width:300px;border:1px solid #c3daf9;"></div>
<input type="button" id="gacv" value="getAllCheckedValue" onclick="fn()" />
</body>
</html>
这是json数组：
[
{"text":"请选择","id":"all1","leaf":false,"checked":false,"depth":"0",
"children":[
{"text":"资产价值","id":"zichanjiazhi","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"100万以下","id":"100yixia","leaf":true,"checked":false,"depth":"2"},
{"text":"100万-500万","id":"100zhi500","leaf":true,"checked":false,"depth":"2"},
{"text":"500万-1000万","id":"500zhi1000","leaf":true,"checked":false,"depth":"2"},
{"text":"1000万以上","id":"1000yishang","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"资产类型","id":"zichanleixing","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"生产类","id":"shengchanlei","leaf":false,"checked":false,"depth":"2",
"children":[
{"text":"土地类","id":"tudilei","leaf":true,"checked":false,"depth":"3"},
{"text":"设备类","id":"shebeilei","leaf":true,"checked":false,"depth":"3"},
{"text":"建筑类","id":"jianzhulei","leaf":true,"checked":false,"depth":"3"}
]
},
{"text":"非生产类","id":"feishengchanlei","leaf":false,"checked":false,"depth":"2",
"children":[
{"text":"土地类","id":"feitudilei","leaf":true,"checked":false,"depth":"3"},
{"text":"设备类","id":"feishebeilei","leaf":true,"checked":false,"depth":"3"},
{"text":"建筑类","id":"feijianzhulei","leaf":true,"checked":false,"depth":"3"}
]
}
]
},
{"text":"单位类型","id":"danweileixing","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"工业","id":"gongye","leaf":true,"checked":false,"depth":"2"},
{"text":"商业","id":"shangye","leaf":true,"checked":false,"depth":"2"},
{"text":"直属企业","id":"zhisuqiye","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"使用状态","id":"shiyongzhuangtai","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"在建","id":"zaijian","leaf":true,"checked":false,"depth":"2"},
{"text":"在用","id":"zaiyong","leaf":true,"checked":false,"depth":"2"},
{"text":"租出","id":"zuchu","leaf":true,"checked":false,"depth":"2"},
{"text":"调拨","id":"diaobo","leaf":true,"checked":false,"depth":"2"},
{"text":"闲置","id":"xianzhi","leaf":true,"checked":false,"depth":"2"},
{"text":"报废","id":"baofei","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"资产来源","id":"zichanlaiyuan","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"购买","id":"gongmai","leaf":true,"checked":false,"depth":"2"},
{"text":"项目","id":"xiangmu","leaf":true,"checked":false,"depth":"2"},
{"text":"融资","id":"rongzhi","leaf":true,"checked":false,"depth":"2"},
{"text":"租入","id":"zuru","leaf":true,"checked":false,"depth":"2"}
]
}
]
}
]
但是发现一个问题就是，当你将节点收拢的后，再展开节点，节点下的构选项无法保存，也就是说，child.ui.toggleCheck(checked);根本没有保存变化，我用的版本是2.0b
smellcode
2008-02-23
引用
mercuryzhang:看你给的连接，只指出了一个方法。不知道checkboxtree的实现和普通的tree的实现有啥区别，能不能把这个发出来看看啊
你其实可以用最简单的树来实现，不用什么extend<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Reorder TreePanel</title>
<link rel="stylesheet" type="text/css" href="../../../support/resources/css/ext-all.css" />
<script type="text/javascript" src="../../../support/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../../support/js/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = "../../../support/resources/images/default/s.gif"
var tree = null;
Ext.onReady(function(){
// shorthand
var Tree = Ext.tree;
tree = new Tree.TreePanel({
el:'tree-div',
autoScroll:true,
animate:true,
enableDD:true,
containerScroll: true,
loader: new Tree.TreeLoader({
dataUrl:'xmmapjson.json'
}),
rootVisible: false
});
tree.on('checkchange', function(node, checked) {
node.expand();
node.attributes.checked = checked;
node.eachChild(function(child) {
child.ui.toggleCheck(checked);
child.attributes.checked = checked;
child.fireEvent('checkchange', child, checked);
});
}, tree);
// set the root node
var root = new Tree.AsyncTreeNode({
text: 'root',
draggable:false,
id:'root'
});
tree.setRootNode(root);
// render the tree
tree.render();
root.expand();
});
var fn = function() {
alert(tree.getChecked('id'));
};
</script>
</head>
<body scroll="no">
<b>Checked Nodes: </b> <input type="text" id="cn" value="" size="40" autocomplete="off" /><br />
<div id="tree-div" style="overflow:auto; height:300px;width:300px;border:1px solid #c3daf9;"></div>
<input type="button" id="gacv" value="getAllCheckedValue" onclick="fn()" />
</body>
</html>
这是json数组：
[
{"text":"请选择","id":"all1","leaf":false,"checked":false,"depth":"0",
"children":[
{"text":"资产价值","id":"zichanjiazhi","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"100万以下","id":"100yixia","leaf":true,"checked":false,"depth":"2"},
{"text":"100万-500万","id":"100zhi500","leaf":true,"checked":false,"depth":"2"},
{"text":"500万-1000万","id":"500zhi1000","leaf":true,"checked":false,"depth":"2"},
{"text":"1000万以上","id":"1000yishang","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"资产类型","id":"zichanleixing","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"生产类","id":"shengchanlei","leaf":false,"checked":false,"depth":"2",
"children":[
{"text":"土地类","id":"tudilei","leaf":true,"checked":false,"depth":"3"},
{"text":"设备类","id":"shebeilei","leaf":true,"checked":false,"depth":"3"},
{"text":"建筑类","id":"jianzhulei","leaf":true,"checked":false,"depth":"3"}
]
},
{"text":"非生产类","id":"feishengchanlei","leaf":false,"checked":false,"depth":"2",
"children":[
{"text":"土地类","id":"feitudilei","leaf":true,"checked":false,"depth":"3"},
{"text":"设备类","id":"feishebeilei","leaf":true,"checked":false,"depth":"3"},
{"text":"建筑类","id":"feijianzhulei","leaf":true,"checked":false,"depth":"3"}
]
}
]
},
{"text":"单位类型","id":"danweileixing","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"工业","id":"gongye","leaf":true,"checked":false,"depth":"2"},
{"text":"商业","id":"shangye","leaf":true,"checked":false,"depth":"2"},
{"text":"直属企业","id":"zhisuqiye","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"使用状态","id":"shiyongzhuangtai","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"在建","id":"zaijian","leaf":true,"checked":false,"depth":"2"},
{"text":"在用","id":"zaiyong","leaf":true,"checked":false,"depth":"2"},
{"text":"租出","id":"zuchu","leaf":true,"checked":false,"depth":"2"},
{"text":"调拨","id":"diaobo","leaf":true,"checked":false,"depth":"2"},
{"text":"闲置","id":"xianzhi","leaf":true,"checked":false,"depth":"2"},
{"text":"报废","id":"baofei","leaf":true,"checked":false,"depth":"2"}
]
},
{"text":"资产来源","id":"zichanlaiyuan","leaf":false,"checked":false,"depth":"1",
"children":[
{"text":"购买","id":"gongmai","leaf":true,"checked":false,"depth":"2"},
{"text":"项目","id":"xiangmu","leaf":true,"checked":false,"depth":"2"},
{"text":"融资","id":"rongzhi","leaf":true,"checked":false,"depth":"2"},
{"text":"租入","id":"zuru","leaf":true,"checked":false,"depth":"2"}
]
}
]
}
]
kaki
2008-02-20
node.eachChild(function(child) {
child.ui.toggleCheck(checked);
child.attributes.checked = checked;
child.fireEvent('checkchange', child, checked);
});
感谢分享，这一句很关键！
发表评论
提醒: 该博客已发表在公共论坛，博客所有留言会成为论坛回贴，留言请注意遵守论坛发贴规则
smellcode
- 浏览: 1142 次
- 性别:
- 来自: 长沙
- 详细资料
搜索本博客
最新评论
-
基于ext2.0的含有checkBox ...
你的JSON数据组是怎么样生成的啊
-- by aiwobucuo -
基于ext2.0的含有checkBox ...
我也写了一个复选框的树 但是我想 知道怎么实现、特定情况下把页面变成灰色 就是不 ...
-- by c_mingze@163.com -
基于ext2.0的含有checkBox ...
smellcode 写道引用mercuryzhang:看你给的连接，只指出了一个 ...
-- by 小蚯蚓 -
基于ext2.0的通过xml构建 ...
bingxue2332 写道有没有通过测试的代码，谢谢了！ var tree ...
-- by smellcode -
基于ext2.0的通过xml构建 ...
有没有通过测试的代码，谢谢了！
-- by bingxue2332
评论排行榜