主从表的Ajax应用开发举例（第一页）

相信大家已经体会到Ajax带给我们的乐趣了吧，每每想到几乎等同于Client端程序的web体验，总是能激动一阵子。那就趁热打铁，再来看看如何在WebShop中构建一个主从表的应用吧！这个例子是基于WebShop所支持的开发语言之一的C#来完成的。而且这个例子已经集成到了WebShop的最新版本WebShop3e_beta的Demo中了。（个人版在官方网站上已经提供免费下载）<o:p></o:p>

大家启动WebShop,然后打开这个project，这个project在安装目录下，路经为：WebShop3e_betaprojectscs_example.wpj。打开后，在左边的目录树就可以看到很多WebShop提供的简单示例demo，这个目录中的demo都是基于c#开发的。现在大家是不是发现了有个masterdetail.htm的文件，双击选中它，然后运行吧。运行效果如下：<o:p></o:p>

<v:shapetype id="_x0000_t75" stroked="f" filled="f" path="m@4@5l@4@11@9@11@9@5xe" o:preferrelative="t" o:spt="75" coordsize="21600,21600"><v:stroke joinstyle="miter"></v:stroke><v:formulas><v:f eqn="if lineDrawn pixelLineWidth 0"></v:f><v:f eqn="sum @0 1 0"></v:f><v:f eqn="sum 0 0 @1"></v:f><v:f eqn="prod @2 1 2"></v:f><v:f eqn="prod @3 21600 pixelWidth"></v:f><v:f eqn="prod @3 21600 pixelHeight"></v:f><v:f eqn="sum @0 0 1"></v:f><v:f eqn="prod @6 1 2"></v:f><v:f eqn="prod @7 21600 pixelWidth"></v:f><v:f eqn="sum @8 21600 0"></v:f><v:f eqn="prod @7 21600 pixelHeight"></v:f><v:f eqn="sum @10 21600 0"></v:f></v:formulas><v:path o:connecttype="rect" gradientshapeok="t" o:extrusionok="f"></v:path><o:lock aspectratio="t" v:ext="edit"></o:lock></v:shapetype><o:p></o:p>

 

 看了效果，还是觉得蛮漂亮的。那么具体是怎么开发和实现的呢，那就让我慢慢道来。<o:p></o:p>

先介绍前端：看看前端的页面的Design View,我们可以看到3个DataSet, 2个DBNavigator,等等控件。让我来详细说明这些控件的配置吧。<o:p></o:p>

　　DataSet1：　<o:p></o:p>

    Active 设置为true表示激活这个空间，所以运行之前一定要设置其为true。<o:p></o:p>

　  Fields: 表示需要连接数据的字段，和相关DataSet.<o:p></o:p>

　MaxRows: 表示在Grid中每一页显示的行数。<o:p></o:p>

　  OpenURL: 从数据库中读取数据，并将数据封装成指定xml格式消息的那个后台文件（这个文件，一会细说）。<o:p></o:p>

　PostURL:接受DataSet的xml消息，将其解析成sql语句并执行，完成数据的更新操作。（也会细说）<o:p></o:p>

    DataSet2:<o:p></o:p>

    DetailFields:从表的主键<o:p></o:p>

　  MasterFields:主表的主键<o:p></o:p>

　　MasterLink:主表相关联的DataSet的名称。<o:p></o:p>

DBNavigaror,DBGrid,DBPageNavigator：这些控件基本只需要设置DataSet属性将这个控件与相关的DataSet关联起来就可以了。<o:p></o:p>

接着就该看看后台逻辑了。后台一共有两个C#文件：一个是MsaterDetail_Query.aspx.cs, 另一个是MsaterDetail_Update.aspx.cs 。为了使大家更易理解，我将贴上文件代码，并加上较详细的注释以帮助大家理解。<o:p></o:p>

MsaterDetail_Query.aspx.cs该文件用于连接数据库，按照前端要求取得需要的数据，并将数据组装成xml返回客户端。由于是主从表，取数据便是按照这样一个机制,即根据前端的maxRow,recNo,和数据库中的数据总条数rowCount来确定主表读取的那个分页有哪些数据行，并逐行读取这些数据，同时主表每读取一条数据，从表便根据主表的这条数据的主键值构造自己的sql，读取从表对应于主表这一行的所有数据条目。<o:p></o:p>