解决TreeView中使用JavaScript完成CheckBox全选的办法
结这次的工作,明白了几个关键的地方:
1.JavaScript中的确可以直接引用.Net服务器端控件,但是问题在于,控件的ID在编译后会自动加上名字空间,所以这里要特别注意。
2.使用JavaScript可以使对TreeView的操作不需要再PostBack,十分方便有效。
3.空间状态的显示和实际存储是有区别的,一定要十分注意。
需要在C#文件中加入:
主要的JavaScript代码如下:
整个功能的实现需要修改微软treeview控件的一个Bug
需要修改inetpub\wwwroot\webctrl_client\1_0\treeview.htc。
把function doCheckboxClick(el)中的第一行,
el.checked = !el.checked;
改成:
el.checked = !el.getAttribute("checked");
1.JavaScript中的确可以直接引用.Net服务器端控件,但是问题在于,控件的ID在编译后会自动加上名字空间,所以这里要特别注意。
2.使用JavaScript可以使对TreeView的操作不需要再PostBack,十分方便有效。
3.空间状态的显示和实际存储是有区别的,一定要十分注意。
需要在C#文件中加入:
TreeView.Attributes.Add("oncheck", "tree_oncheck()");
主要的JavaScript代码如下:
<script language="javascript">
<!--
function tree_oncheck()
{
var node = TreeView.getTreeNode(event.treeNodeIndex);
var Pchecked = node.getAttribute("checked");
setcheck(node, Pchecked);
TreeView.queueEvent('oncheck', node.getNodeIndex());
}
function setcheck(node, Pc)
{
var ChildNode = new Array();
ChildNode = node.getChildren();
if (parseInt(ChildNode.length) != 0)
{
for (var i = 0; i < ChildNode.length; i++)
{
var cNode = ChildNode[i];
if (cNode.getAttribute("checked") != Pc)
{
if (parseInt(cNode.getChildren().length) != 0)
setcheck(cNode, Pc);
cNode.setAttribute("checked", Pc);
TreeView.queueEvent('oncheck', cNode.getNodeIndex());
}
}
}
}
//-->
</script>
<!--
function tree_oncheck()
{
var node = TreeView.getTreeNode(event.treeNodeIndex);
var Pchecked = node.getAttribute("checked");
setcheck(node, Pchecked);
TreeView.queueEvent('oncheck', node.getNodeIndex());
}
function setcheck(node, Pc)
{
var ChildNode = new Array();
ChildNode = node.getChildren();
if (parseInt(ChildNode.length) != 0)
{
for (var i = 0; i < ChildNode.length; i++)
{
var cNode = ChildNode[i];
if (cNode.getAttribute("checked") != Pc)
{
if (parseInt(cNode.getChildren().length) != 0)
setcheck(cNode, Pc);
cNode.setAttribute("checked", Pc);
TreeView.queueEvent('oncheck', cNode.getNodeIndex());
}
}
}
}
//-->
</script>
整个功能的实现需要修改微软treeview控件的一个Bug
需要修改inetpub\wwwroot\webctrl_client\1_0\treeview.htc。
把function doCheckboxClick(el)中的第一行,
el.checked = !el.checked;
改成:
el.checked = !el.getAttribute("checked");
posted on 2004-07-15 14:38 Howard 阅读(3016) 评论(4) 编辑 收藏 引用 收藏至365Key 所属分类: 技术人生
评论
# re: 解决TreeView中使用JavaScript完成CheckBox全选的办法 2004-07-15 14:45 bestcomy
不知道这样的操作结果在服务器端是否可以正确获得,因为在实际的应用中曾经发生这样的状况,如果服务器端显式设置过checkbox的状态后,客户端的设置改变无法在服务器端获得 回复
# re: 解决TreeView中使用JavaScript完成CheckBox全选的办法 2004-07-15 15:06 Howard
我之前遇到的情况就是“客户端的设置改变无法在服务器端获得”,现在这个问题已经解决,所以我才整理这些代码。
但是有一点忘记加了,就是
微软的treeview控件有一个bug,在postback之后,再点击checkbox就会乱了。
需要修改inetpub\wwwroot\webctrl_client\1_0\treeview.htc。
把function doCheckboxClick(el)中的第一行,
el.checked = !el.checked;
改成:
el.checked = !el.getAttribute("checked");
十分感谢公司同时Neil Wang在此问题上对我的帮助
回复
# re: 解决TreeView中使用JavaScript完成CheckBox全选的办法 2005-06-17 11:00 pei
好象这样还是会存在问题
在大部分的时候是正常的
有些时候,会有客户端的显示和最终服务器端会有不一致的情况出现
问题原因暂时还没有找到