使用asp.net Ajax控件PopupControlExtender与GridView联合显示详情列表

简介:

众所周知,由社区开发的AjaxControlToolkit,为asp.net展现富客户端效果和提高web程序性能带来了很大的帮助。里面有大量的实现各种功能的控件可供直接使用。

PopupControlExtender就是其中的一个。我们称呼其为“弹出控件”。它主要的功能是让asp.net控件打开一个弹出对话框,来显示其他额外的信息或选项。弹出控件可以包含任何内容。特别值得一提的是,弹出控件具备通过Web服务或页面方法取得数据的功能。

根据PopupControlExtender的主要作用和其能取得页面数据的特性,下面我们用它来实现显示详情对话框的功能。(在这之前,我们通常的做法是使用一个Gridview+一个FormView或一个GridView+一个DetailsView)。现在我们只需要一个GridView即可。相关实现如下:


这里一个简单的示例是正在做的一个权限管理中的一个显示资源的页面:

.aspx:

几个关键的属性解释:

TargetControlID:要被弹出控件 扩转的控件ID;

DynamicContextKey:要传递给Web服务或页面方法的任意字符串值,这里绑定给他资源的编号:moduleCode;

DynamicControlID:需要执行了Web服务或页面方法后所回的结果的控件的ID,比如上例,我们将该属性值设为Panel2,因为其根据moduleCode提取完成数据后,显示在表格中,而表格是嵌入在Panel2中的,所以Panel2是数据的接收者。

DynamicServiceMethod:要调用的Web服务方法或页面方法。

如果使用的C#,此方法必须符合下列签名格式:

[System.Web.Services.WebMethod]

[System.Web.Script.Services.ScriptMethod]

public string DynamicServiceMethod(string contextKey) {....}

如果使用的VB.net,此方法必须符合下列签名格式:

<System.Web.Services.WebMethod>_

<System.Web.Script.Services.ScriptMethod>_

public Function DynamicServiceMethod(ByVal contextKey As String) As String

.....

End Function

备注:Web服务方法的名称不一定叫做:DynamicServiceMethod,您可以使用任意的名称作为此方法的名称,但请记住,参数的名称与类型以及返回值的类型,务必与上述格式完全相同,其他相关属性,不作详细说明(都是易于理解的)

.cs:


导入Web服务的命名空间:


为“放大镜”图片设置鼠标移入和鼠标移除属性


WebServices方法,用来从后台获取数据:


效果图如下:(放大镜图片是在GridView中的一个模板列中放置的,因为为其设置了鼠标移入移除属性,所以当鼠标移入编号为17的放大镜上时会调用以上GetDetails方法,取得详细数据呈现出来)

注意:如果不设置table的width和用于呈现的Panel2的width可能会显示不出详情,所以,务必设置其宽度。




原文发布时间为:2010-06-13


本文作者:vinoYang


本文来自云栖社区合作伙伴CSDN博客,了解相关信息可以关注CSDN博客。

目录
相关文章
|
3月前
|
开发框架 JavaScript 前端开发
震撼!破解 ASP.NET 服务器控件 Button 执行顺序之谜,颠覆你的开发认知!
【8月更文挑战第16天】在ASP.NET开发中,通过Button控件实现先执行JavaScript再触后台处理的需求十分常见。例如,在用户点击按钮前需前端验证或提示,确保操作无误后再传递数据至后台深度处理。此过程可通过设置Button的`OnClientClick`属性调用自定义JavaScript函数完成验证;若验证通过,则继续触发后台事件。此外,结合jQuery也能达到相同效果,利用`__doPostBack`手动触发服务器端事件。这种方式增强了应用的交互性和用户体验。
46 8
|
1月前
|
开发者 Windows
.NET 开源扁平化、美观的 C/S 控件库
【10月更文挑战第23天】介绍了三款适用于 .NET 平台的开源扁平化、美观的 C/S 控件库:MaterialSkin 采用 Google Material Design 风格,适合现代感界面;Krypton Toolkit 提供丰富控件,界面易于定制;Fluent Ribbon Control Suite 模仿 Office 界面,适合复杂功能应用。每款控件库均附有示例代码及 GitHub 链接。
|
6月前
|
开发框架 前端开发 JavaScript
ASP.NET AJAX使用方法概述(三)
ASP.NET AJAX使用方法概述(三)
51 1
winform .net6 和 framework 的图表控件,为啥项目中不存在chart控件,该如何解决?
本文讨论了在基于.NET 6和.NET Framework的WinForms项目中添加图表控件的不同方法。由于.NET 6的WinForms项目默认不包含Chart控件,可以通过NuGet包管理器安装如ScottPlot等图表插件。而对于基于.NET Framework的WinForms项目,Chart控件是默认存在的,也可以通过NuGet安装额外的图表插件,例如LiveCharts。文中提供了通过NuGet添加图表控件的步骤和截图说明。
winform .net6 和 framework 的图表控件,为啥项目中不存在chart控件,该如何解决?
|
1月前
|
C# Android开发 iOS开发
一组.NET MAUI绘制的开源控件 - AlohaKit
一组.NET MAUI绘制的开源控件 - AlohaKit
|
2月前
|
开发框架 JavaScript 前端开发
|
6月前
|
开发框架 缓存 前端开发
安装ASP.NET AJAX (一安装)
安装ASP.NET AJAX (一安装)
101 0
N..
|
6月前
|
XML JSON 前端开发
jQuery实现Ajax
jQuery实现Ajax
N..
68 1
|
6月前
|
XML 前端开发 JavaScript
jQuery中ajax如何使用
jQuery中ajax如何使用
69 0
|
5月前
|
前端开发 JavaScript
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
46 0
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]