您所在的位置: 首页>>开发>>.Net>>

深入剖析微软ASP.NET Ajax中的数据绑定构架下篇之二(1)

http://developer.51cto.com  2007-07-03 15:32  朱先忠  51CTO.com  我要评论(0)
  • 摘要:在上篇中,我们已经分析了微软ASP.NET Ajax(以后简称为“MS AJAX”)中的数据绑定构架并给出了一个简单的示例。在本篇中,我们将继续探讨MS AJAX中的数据绑定构架的实际应用,并将给出两个不同的更为高级的案例分析。
  • 标签:ASP.NET Ajax  ASP.NET  Ajax  Web  数据  微软

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

【51CTO.com独家特稿】四、例2—数据库绑定

现在,我们来讨论更为复杂的数据库绑定的例子。根据我们前面的讨论,我们找到了使用DataSource的典型场所;在前面的例1中,我们使用了一种内存数据来模拟有状态的web服务。但是,在实际开发中,一般不这样使用。在本节中,我们要创建一个非常贴近于实际开发环境应用的例子。

1.创建工程

启动Visual Studio 2005并选用模板“ASP.NET AJAX CTP-Enabled Web Site”创建一个新的网站并命名为DatabaseBinding,最后选定Visual C#为内置语言。然后,稍微修改页面Default.aspx,最后的结果如下图4所示。

图4:示例2的设计时刻页面

2.后台代码分析

下面是页面Default.aspx中HTML元素的定义部分。

列表6

<!--------------------------------------------------->
<div id="detailsView"></div>
<!--------------------------------------------------->
<input type="button" id="previousButton" value="Previous"
title="Go to previous row" style="width: 67px; height: 30px;" />
<span id="rowIndexLabel"></span>
<input id="nextButton" type="button" value="Next" title="Go to next row"
style="width: 67px; height: 30px;" />
<input type="button" id="addButton" value="Add" title="Create a new row"
style="width: 67px; height: 30px;" />
<input type="button" id="delButton" value="Delete"
title="Delete the current row" style="width: 67px; height: 30px;" />
<input type="button" id="saveButton" value="Save"
title="Save all pending changes" style="width: 67px; height: 30px;" />
<input type="button" id="refreshButton" value="Refresh"
title="Discard pending changes and get the latest data from the server"
style="width: 73px; height: 30px" />
<!--------------------------------------------------->
<div style="visibility:hidden;display:none" >
<div id="detailsTemplate" class="ListWindow">
Name: <input id="nameField" size="30" /><br />
Address:<br />
<textarea id="addressField" style="width: 428px;
height: 130px" rows="4" cols="4"></textarea><br />
</div>
<div id="emptyTemplate">
Loading Data...
</div>
</div>

根据图4中的布局和上面的代码,我们在此首先定义了两个导航按钮—previousButton和nextButton—它们都用于显示于客户端(而不是服务器端)的控件ItemView相应的数据源的数据记录间的导航。然后,我们定义了两个按钮(addButton,delButton)以实现对数据库中记录的修改操作。最后两个按钮—saveButton和refreshButton直接相应于MS AJAX客户端控件DataSource的save和load两个方法。之后,我们使用了一组HTML DIV元素来描述控件ItemView。在此,建议你把这里的对应关系与例一1中的控件ListView与HTML元素的对应关系加以比较。

3.创建一个连接到数据库的Web服务

(1)创建一个示例数据库—DataBind.mdf

右击工程并选定“添加新项”,然后选择模板“SQL数据库”,你可以容易地创建一个空的数据库—在此,我们命名它为DataBind.mdf。然后,我们把唯一的一个表(Employees)添加到其中。这个表中包含三个字段:Id(int,primary key),Name(nvarchar(50),not empty)和Address (nvarchar(50),not empty)。同时,我们还创建了四个简单的存储过程:DeleteRecord,GetAllRecords,InsertRecord,UpdateRecord,它们相应于典型的数据库CRUD操作。因为我们的重点不在此,所以不再详细加以讨论。

(2)创建一个类—Employee

注意,这个类非常类似于第一个例子中的类Employees—充当数据库表格的OOP包装;具体地说,这是通过把它的修饰有属性DataObjectField的成员变量映射到定义于表格Employees中的字段实现的。

(3)两个帮助者类—SqlHelper(来自于MS AJAX示例中)和SqlTaskProvider

为了问题的简化和通用起见,我们创建了两个帮助者类。一个是SqlHelper(来自于随同MS AJAX发行的示例程序TaskList);另一个是SqlTaskProvider。由于这些内容有些远离了本文的主题,所以,在此也不多解释,有兴趣的读者可详细研究本文所附源码。

现在,让我们来创建一个DataService(派生自Web Service)并使之与数据库相连接。


共3页: 1 [2] [3] 下一页
【内容导航】
重复数据删除技术
企业级Web2.0 你准备好了么?
WebSphere 实现SOA的利器
Web安全云时代
微软Forefront企业安全解决方案
 
 验证码: (点击刷新验证码)   匿名发表
  • Visual C++ 完全自学宝典

  • 作者:强锋科技,朱洪波
  • Visual C++ 6.0是微软公司为程序人员提供的Visual Studio 6.0工具套件中的重要组成部分。本书由浅入深地介绍使用Visual C++ 6.0..
Copyright©2005-2008 51CTO.COM 版权所有