DynamicPopulate
DynamicPopulate控件动态的，允许程序在运行过程中更改指定控件的内容，类似于使用“document.getElementById(‘controlid’).value='contents'”这样的语句。可以让页面在客户端运行时查询某个web service或页面的方法。并将其返回的HTML字符串插入到页面的某个控件中。
属性列表：
BehaviorID:行为的ID，用于在客户端获取Ajax控件。
TargetControlID:需要动态填充内容的控件
ClearContentsDuringUpdate:在更新的时候是否清空内容
ServiceMethod:获取数据需要使用的WEB服务
UpdatingCssClass:更新过程中使用的样式
ContextKey:上下文关键字，可通过此关键字判断返回什么类型的数据
CustomScript:一段自定义的脚本，此脚本必须能被格式化为字符串
PopulateTriggerControlID:引发填充事件的控件的ID
实例解析一、动态填充实例
1.创建根据关键字获取数据的WEB服务
/// <summary>
/// PopulateService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class PopulateService : System.Web.Services.WebService {
public PopulateService () {
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public string HelloWorld(string Context) {
string returnValue = "";
switch (Context)
{
case "dd":
returnValue="你选择了ss";
break;
case "dddd":
returnValue="你选择了s";
break;
default:
returnValue = "你什么也没有选";
break;
}
return returnValue;
}
}
2.UI界面
<head runat="server">
<title>无标题页</title>
<script type="text/javascript">
function updatekey(value)
{
var behavior=$find('dpe1');
if(behavior)
{
behavior.populate(value);
}
}
Sys.Application.add_load(function(){updatekey('qq);});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" Height="247px" Width="521px">
</asp:Panel>
<cc1:dynamicpopulateextender id="DynamicPopulateExtender1" runat="server" servicemethod="HelloWorld"
targetcontrolid="Panel1" ServicePath="PopulateService.asmx" BehaviorID="dpe1" ClearContentsDuringUpdate="true"></cc1:dynamicpopulateextender>
</ContentTemplate>
</asp:UpdatePanel>
<input type="button" value="a" ID="Button3" OnClick="updatekey(this.value)" />
<input type="button" value="b" ID="Button2" OnClick="updatekey(this.value)" />
<input type="button" value="不选" ID="Button1" OnClick="updatekey(this.value)" />
</form>
</body>
实例解析二、GridView中的详细信息显示
1.前台UI
<head runat="server">
<title>DynamicPopulate Page</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.gridRow
{
padding: 5px;
}
.updating
{
background-image: url('progress.gif');
background-repeat: no-repeat;
padding: 2px;
height: 2em;
margin: 5px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="sm" runat="server"></asp:ScriptManager>
<h3>新闻管理</h3>
<asp:GridView ID="newsList" runat="server" AutoGenerateColumns="False" DataSourceID="newsDataSource"
Width="100%" ShowHeader="false">
<Columns>
<asp:TemplateField ItemStyle-CssClass="gridRow">
<ItemTemplate>
<asp:HyperLink ID="hlMore" Text="more..." NavigateUrl="#" runat="server"></asp:HyperLink>
<asp:Label ID="lbTitle" runat="server" Text='<%# Bind("Title") %>' Font-Bold="true"></asp:Label>
<asp:Panel ID="newsDetails" runat="server">
</asp:Panel>
<ajaxToolkit:DynamicPopulateExtender ID="dp" ContextKey='<% #Eval("Id") %>' PopulateTriggerControlID="hlMore" ServiceMethod="GetNewsDetailsHTMLString" ServicePath="NewsService.asmx" TargetControlID="newsDetails" UpdatingCssClass="updating" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:ObjectDataSource ID="newsDataSource" runat="server" SelectMethod="GetNewsList" TypeName="NewsData">/asp:ObjectDataSource>
</form>
</body>
2.WEB服务NewsService.asmx
<%@ WebService Language="C#" Class="NewsService" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
[WebService(Namespace = "http://www.dflying.net/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService()]
public class NewsService : System.Web.Services.WebService
{
[WebMethod]
public string GetNewsDetailsHTMLString(string contextKey)
{
// 让线程休眠秒，模拟网络延时
System.Threading.Thread.Sleep(2000);
// 尝试将contextKey转换为int
int newsId;
if (!int.TryParse(contextKey, out newsId))
{
return string.Empty;
}
// 调用NewsData的GetNewsDetail静态方法取得该条新闻的详细信息
NewsEntry news = NewsData.GetNewsDetail(newsId);
// 生成表示该条新闻的HTML
System.Text.StringBuilder newsHTMLBuilder = new System.Text.StringBuilder();
newsHTMLBuilder.AppendFormat("<div style='text-align: center;'>posted by {0} at {1}, {2} views</div>", news.Author, news.PostDate.ToShortDateString(), news.Views);
newsHTMLBuilder.AppendFormat("<div>{0}</div>", news.Content);
return newsHTMLBuilder.ToString();
}
}
