0 Comments

深入剖析微软ASP.NET Ajax中的数据绑定架构上篇之

发布于:2013-10-22  |   作者:广州网站建设  |   已聚集:人围观

ListView控件中的常用属性

 

属性名 描述
Id 标识ListView控件。
canMoveNext 如果还存在下一条记录,则为true;否则为false
canMovePrevious 如果还存在前一条记录,则为true;否则为false
data ItemView控件一致
dataIndex 标识当前记录的索引值。
dataItem 基于dataIndex返回当前记录。
length 返回记录记录总数。
alternatingItemCssClass 指定可选项使用的css类。
layoutTemplate 这个模板用于生成列表容器(例如,使用一个<table>标签),头部(例如,使用一个<thead>标签)和页脚。你必须为一个ListView指定一个layoutTemplate。这个模板必须包含一个itemTemplate,也可以包含一个separatorTemplate
itemCssClass 指定各项所使用的css类。
itemTemplate 这个模板用于生成列表中单个项(例如,使用一个<tr>标签)。它必须包含于layoutTemplate内。
EmptyTemplate 这个模板用于当数据源中没有数据项时(或该ListView仍然等待来自于服务器端的数据时)生成一个空消息。
selectedItemCssClass 指定选择项。
seperatorCssClass 指定项分隔符对应的css类。
seperatorTemplate 这个模板用于生成列表中相邻两项间的一个分隔符(例如,使用一个<hr>标签)。它必须包含于layoutTemplate内。
itemTemplateParentElementID 这个属性用于定义itemTemplateseparatorTemplate的父元素。这样以来,记录项和分隔符即可反复出现于这个元素中(例如,使用一个<tbody>标签)。

 

就和ItemView一样,为了使用一个ListView控件,你必须提供给MS AJAX一些模板以便让它知道如何生成你的内容。实践中,这些模板通常相应于一些特定的HTML元素(例如div等),因此学习这部分内容时一定要特别仔细加以对照。

好,理论方面的讨论已经足够多了。在下一节中,我们将构建一个简单的示例来实际体验一下MS AJAX中的客户端数据绑定!
广州网站建设,网站建设,广州网页设计,广州网站设计

四、开始使用数据绑定—一个简单的例子

1、创建一个ASP.NET AJAX CTP-Enabled网站

启动Visual Studio 2005,然后选择菜单项“文件|新建网站…”,使用模板“ASP.NET AJAX CTP-Enabled网站”创建一个新的网站,并命名工程为AJAXCTPDev311(选择Visual C#作为内置语言)。此后,系统应该自动地添加对必要的程序集—Microsoft.Web.Preview.dll和System.Web.Extension.dll的参考。此外,你会注意到一个ScriptManager服务器控件自动地添加到页面中。注意,这个服务器控件作为整个ASP.NET AJAX框架的控制中心。

然后,稍经修改,页面Default.aspx看起来如图5所示:

 

图5:设计时刻的示例web页面

 

勿需多言,下面首先让我们来观察一下这个aspx页面相应的源代码:

列表4

广州网站建设,网站建设,广州网页设计,广州网站设计

<head runat="server">
<title>Client-Side Data Binding Test</title>
</head>
<body style="font-size: 12pt">
<form id="form1" runat="server">
<asp:ScriptManager 
ID="ScriptManager1" runat="server" >
<Services>
<asp:ServiceReference 
Path="BookDataService.asmx" />
</Services>
<Scripts>
<asp:ScriptReference Assembly="Microsoft.Web.Preview" 
Name="PreviewScript.js" />
</Scripts>
</asp:ScriptManager>
<div style="text-align: left">
<span style="color: #0000cc"><span style="font-size: 24pt">
<span>
Client-Side Data Binding Test</span>
<br />
</span></span>
</div>
<br />
<div id="header">
<input type="button" id="Button5" 
value="Get Book by Title" />
<br />
</div>
<div id="Book titles to be listed here">
</div>
<div id="Books"></div>
<div style="display:none;">
<div id="LayoutTemplate">
<div id="ItemTemplateParent">
<div id="ItemTemplate">
<span id="BookTitle"></span>
</div>
</div>
</div>
<div id="emptyTemplate">
empty...
</div>
</div>  
<script type="text/xml-script">
<page xmlns="http://schemas.microsoft.com/xml-script/2005">
<components>
<dataSource id="BooksDataSource" 
serviceURL="BookDataService.asmx" />
<button id="Button5" >
<click>
<invokeMethodAction 
target="BooksDataSource" method="load" />
</click>
</button>
<listView id="Books" 
itemTemplateParentElementId="ItemTemplateParent">
<bindings>
<binding dataContext="BooksDataSource" dataPath="data" 
property="data" />
</bindings>
<layoutTemplate>
<template layoutElement="LayoutTemplate" />
</layoutTemplate>
<itemTemplate>
<template layoutElement="ItemTemplate">
<label id="BookTitle">
<bindings>
<binding dataPath="Title" property="text" />
</bindings>
</label>
</template>
</itemTemplate>
<emptyTemplate>
<template layoutElement="emptyTemplate" />
</emptyTemplate>
</listView>
</components>
</page>
</script>
</form>
</body>
 

标签:
飞机