`
webcode
  • 浏览: 5929813 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

扩展 TreeView 实现选择 CheckBox 自动回发

 
阅读更多
天CSDN 有一网友提出这样的需求:实现点击 TreeView 的 CheckBox 即自动 PostBack
http://community.csdn.net/Expert/TopicView3.asp?id=5708685

解决方案可以考虑:
1. 在客户端手动通过 js 捕获 checkbox 的 click 事件,然后显示的执行 __doPostBack 方法
对于如何捕获事件,获取目标节点,与类似 TreeView几个小技巧 提到的 父子节点CheckBox的级联选择 类似

2. 扩展 TreeNode(继承 System.Web.UI.WebControls.TreeNode)
然而 TreeNode 并未继承自 System.Web.UI.Control,故而无法访问 checkbox 自控件,其无 Render 之类的方法。虽然它对控件开发者提供了 RenderPreText RenderPostText 方法,分别在节点前、后添加自定义信息,但还是无法访问 CheckBox。

看来此路暂时不通

3. 扩展 TreeView,重写 Render,通过 HtmlTextWriter 获取呈现的 html 代码,并想办法遍历其中的 <input type=checkbox /> 为其添加 onclick=_doPostBack

经测试此法,我看行

XTreeView.cs
usingSystem;
usingSystem.Data;
usingSystem.Configuration;
usingSystem.IO;
usingSystem.Text;
usingSystem.Text.RegularExpressions;
usingSystem.Web;
usingSystem.Web.Security;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.WebControls.WebParts;
usingSystem.Web.UI.HtmlControls;
usingSystem.Xml;

namespaceDigdotnet.Test
{
/**////<summary>
///XTreeView的摘要说明
///</summary>

publicclassXTreeView:TreeView
{
/**////<summary>
///为checkbox添加客户端事件click处理程序。
///<remarks>
///
///默认TreeView节点呈现为
///<inputtype="checkbox"name="TreeView1n2CheckBox"id="TreeView1n2CheckBox"title="1.1.1"/>
///<aclass="TreeView1_0"href="javascript:__doPostBack('TreeView1','s1//1.1//1.1.1')"onclick="TreeView_SelectNode(TreeView1_Data,this,'TreeView1t2');"id="TreeView1t2">1.1.1</a>
///
///重写Render方法之后呈现为
///<inputtype="checkbox"name="TreeView1n2CheckBox"id="TreeView1n2CheckBox"onclick="TreeView_SelectNode(TreeView1_Data,this.nextSibling,'TreeView1t2');__doPostBack('TreeView1','s1//1.1//1.1.1')"title="1.1.1"/>
///<aclass="TreeView1_0"href="javascript:__doPostBack('TreeView1','s1//1.1//1.1.1')"onclick="TreeView_SelectNode(TreeView1_Data,this,'TreeView1t2');"id="TreeView1t2">1.1.1</a>
///
///</remarks>
///</summary>
///<paramname="writer"></param>

protectedoverridevoidRender(HtmlTextWriterwriter)
{
if(DesignMode){//设计时,不做处理
base.Render(writer);
return;
}


//
StringWritersw=newStringWriter();
HtmlTextWriterhtmlWriter
=newHtmlTextWriter(sw);
//输出TreeView的html源码
base.Render(htmlWriter);
//
sw.Flush();
stringtreeHtml=sw.ToString();

//从节点的<a/>标记中分析href和onclick属性中的两个js函数,
//并插入checkbox的onclick事件
stringpattern=@"<input.*(id=.*)title=.*/>[/n/r/s]*<a.*href=.*(__doPostBack.*)"".*onclick=.*(TreeView_SelectNode.*);"".*id=.*"">";
Matchmatch
=Regex.Match(treeHtml,pattern);
//正则替换
treeHtml=Regex.Replace(treeHtml,pattern,newMatchEvaluator(ReplaceTextCallback));

//呈现经过处理的TreeView
writer=newHtmlTextWriter(Context.Response.Output);
writer.Write(treeHtml);
}


/**////<summary>
///正则替换回调方法。
///</summary>
///<paramname="match"></param>
///<returns></returns>

privatestaticstringReplaceTextCallback(Matchmatch)
{
intpos=match.Value.IndexOf(match.Groups[1].Value)+match.Groups[1].Value.Length+1;
returnmatch.Value.Insert(pos,String.Format(@"onclick=""{0};{1}""",match.Groups[3].Value.Replace("this","this.nextSibling"),match.Groups[2].Value));
}

}

}


测试页面

<%@PageLanguage="C#"%>
<%@RegisterTagPrefix="ddntest"Namespace="Digdotnet.Test"%>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<scriptrunat="server">

protected
voidTreeView1_TreeNodeCheckChanged(objectsender,TreeNodeEventArgse)
{
Label1.Text
=String.Format("Youcheckthenodewhose<fontcolor='red'>Text={0}andValuePath={1}</font>",e.Node.Text,e.Node.ValuePath);
}

</script>

<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>扩展TreeView实现选择CheckBox自动回发</title>
</head>
<body>
<formid="form1"runat="server">
<div>
<h1>扩展TreeView实现选择CheckBox自动回发</h1>
<inputtype="button"value="Refresh"onclick="location.href=location.href"/>
<ddntest:XTreeViewid="TreeView1"runat="server"ShowCheckBoxes="All"OnTreeNodeCheckChanged="TreeView1_TreeNodeCheckChanged">
<Nodes>
<asp:TreeNodeText="1">
<asp:TreeNodeText="1.1">
<asp:TreeNodeText="1.1.1"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNodeText="2">
<asp:TreeNodeText="2.1">
<asp:TreeNodeText="2.2.1"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</ddntest:XTreeView>
<asp:LabelID="Label1"runat="server"></asp:Label>
</div>
</form>
</body>
</html>

测试效果


BTW,对于 AJAX 大肆流行的今天, PostBack 似乎大家都敬而远之,是否需要此功能,还是看个人应用实际需求了。

分享到:
评论

相关推荐

    C#开发经验技巧宝典

    0434 如何使Pannel实现横向滚动纵向自动扩展 238 0435 属性MaintainScrollPositionOnPostBack实现网页定位 238 0436 自动隐藏式菜单 238 0437 关闭弹出窗口刷新父窗口 239 0438 弹出网页模式对话框 240 ...

    asp.net专家疑难解答200问源码

    107.如何实现选择DataList控件中的条目后显示该条目的详细信息 108.如何实现DataList控件的编辑功能 109.如何对DataList控件使用样式 110.如何在DataList控件中创建多个列 111.如何实现DataList控件的分页功能 ...

    asp.net专家疑难解答200问

    如何实现选择DataList控件中的条目后显示该条目的详细信息 108.如何实现DataList控件的编辑功能 109.如何对DataList控件使用样式 110.如何在DataList控件中创建多个列 111.如何实现DataList控件的...

    C#编程经验技巧宝典

    43 &lt;br&gt;0061 树的实现 44 &lt;br&gt;3.2 排序 48 &lt;br&gt;0062 如何实现选择排序算法 48 &lt;br&gt;0063 如何实现冒泡排序算法 49 &lt;br&gt;0064 如何实现快速排序算法 50 &lt;br&gt;0065 如何实现插入排序算法 ...

    asp.net知识库

    HttpModule 实现 ASP.Net (*.aspx) 中文简繁体的自动转换,不用修改原有的任何代码,直接部署即可! 服务器自定义开发二之客户端脚本回发 Web开发: 使用URL重写WEB主题切换 如何在Asp.Net1.1中实现页面模板(所谓的...

    vfp6.0系统免费下载

    答案: 请将电子邮件发往以下地址: foxmktg@microsoft.com --------------------------------------------------------------------- 部分 2. Visual FoxPro 6.0 新增功能 问题 2-1: Visual FoxPro 6.0 中有哪些...

    免费DataGridView打印及.NET轻松打印控件5.0版

    除此之外的其他除容器控件之外的控件如CheckBox、ComboBox、Button控件等则直接以图片的形式打印,函数还支持嵌套容器控件的打印,且如果一页打印不下具有自动换页续打功能)。借助该函数的功能,您可以在Panel等...

    ASP.NET2.0高级编程(第4版)1/6

    19.6 回送和跨页面的回送669 19.7 隐藏的字段、ViewState  和ControlState671 19.8 为短时间状态存储应用  HttpContext.Current.Items675 19.9 小结676 第20章 高速缓存679 20.1 高速缓存679  20.1.1 输出高速...

    2.ASP.NET.2.0.高级编程(第4版) [1/7]

    14.3.4 在TreeView中选择多个选项 475 14.3.5 在TreeView控件中指定定制的图标 478 14.3.6 指定用于连接节点的线条 479 14.3.7 编程使用TreeView控件 481 14.4 Menu服务器控件 487 14.4.1 给Menu控件应用不同的...

    ASP.NET.4揭秘

    2.2.2 使用checkbox控件54 2.2.3 使用radiobutton控件57 2.3 提交表单数据60 2.3.1 使用button控件61 2.3.2 使用linkbutton控件62 2.3.3 使用imagebutton控件65 2.3.4 button控件使用客户端脚本68 2.3.5 执行跨页面...

    ASP.NET 控件的使用

    10.1.5 启用自动回传 303 10.1.6 使用列表项集合 304 10.2 使用DropDownList控件 307 10.3 使用RadioButtonList控件 308 10.4 使用ListBox控件 310 10.5 使用CheckBoxList控件 313 10.6 使用BulletedList控件 314 ...

    Visual Basic 6编程技术大全 中译本扫描版带书签 2/2

    1.1.2 选择工程类型1 1.1.3 IDE窗口2 1.1.4 菜单5 1.1.5 工具栏6 1.1.6 Toolbox7 1.2 第一个VB应用程序9 1.2.1 向窗体添加代码9 1.2.2 设置控件的属性10 1.2.3 为控件命名12 1.2.4 移动及重新调整控件尺寸13 1.2.5 ...

    Visual Basic 6编程技术大全 中译本扫描版带书签 1/2

    1.1.2 选择工程类型1 1.1.3 IDE窗口2 1.1.4 菜单5 1.1.5 工具栏6 1.1.6 Toolbox7 1.2 第一个VB应用程序9 1.2.1 向窗体添加代码9 1.2.2 设置控件的属性10 1.2.3 为控件命名12 1.2.4 移动及重新调整控件尺寸13 1.2.5 ...

Global site tag (gtag.js) - Google Analytics