主从表的Ajax应用开发举例(第一页)

相信大家已经体会到Ajax带给我们的乐趣了吧,每每想到几乎等同于Client端程序的web体验,总是能激动一阵子。那就趁热打铁,再来看看如何在WebShop中构建一个主从表的应用吧!这个例子是基于WebShop所支持的开发语言之一的C#来完成的。而且这个例子已经集成到了WebShop的最新版本WebShop3e_betaDemo中了。(个人版在官方网站上已经提供免费下载)<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,我们可以看到3DataSet, 2DBNavigator,等等控件。让我来详细说明这些控件的配置吧。<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:接受DataSetxml消息,将其解析成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>

你可能感兴趣的:(sql,Ajax,xml,F#,ext)