WebMatrix是一款小巧的开发工具,只有2.8M左右,却几乎具有VS.NET的全部功能......
开发数据库访问程序
动态网页开发中最常见的恐怕就是开发数据库访问程序。WebMatrix为开发ASP.NET数据库访问程序提供了很好的支持。观察一下WebMatrix主界面右上区域的工作区管理栏(Workspace),会发现在Workspace标签页的旁边还有一个Data标签页,这里还提供了一个数据栏(Data)

,点击Data标签页就进入了数据窗口(Data),如图8所示。

图8:数据窗口
开发数据库访问程序首先要建立数据库连接,点击数据窗口中的添加数据库连接按钮

,可以看到添加新数据库连接项目窗口,如图9所示。

图9:添加数据库连接
WebMatrix可以支持Access数据库,也可以支持SQL Server/MSDE数据库/桌面引擎,如果是后者的话,可以得到更好的支持,在这里为简便起见,可以选择Access Database,点击OK,从弹出的对话框中选择一个Access数据库,比如Access自带的Sample数据库:家庭成员地址数据库文件ADDRBOOK.MDB,点击OK后可以看到WebMatrix已经在数据窗口中建好了一个数据库连接,从中可以看到数据库中的数据表,如图10所示。

图10:一个建立好的数据连接
建好了数据库连接后,剩下来的事情就简单了,新建一个ASP.NET程序文件DataBaseAccess.aspx,然后在数据窗口中选择一个数据表(比如"家庭成员"表)拖放到页面设计视图上,可以看到页面上自动建立了一个MxDataGrid控件和一个AccessDataSourceControl控件,并自动完成了数据集的关联,如图11所示。

图11:拖放一个数据表到页面设计视图区后的效果
此时已经完成了一个具有基本的数据显示功能的数据库访问程序的开发。点击运行按钮运行程序,可以看到页面的显示效果--页面上显示出一张有关家庭成员信息的数据表,可以看到这个数据表还进行了自动分页显示处理,在表格的最后一行是数据分页显示的页码链接,用鼠标点击表格的表头各列,表中数据可以自动按照该列排序显示,这样的数据表已经可以满足一般的页面数据显示需要,而此时你甚至还没有编写一行代码。

图12:DataBaseAccess程序运行效果
作为一个数据库访问程序,仅仅有数据显示功能当然是不够的,还需要加上一些基本的增、删、改等交互功能,下面我们为DataBaseAccess程序加入数据查询功能。
回到页面设计视图,从工具箱中将WebControls栏中的TextBox和Button拖放到页面设计视图上,将Button的"Text"属性设为"查询",再将一个DataGrid控件拖放到下一行,如图13所示。可以看到这几个控件的名字被缺省设定为TextBox1、DataGrid1、Button1。

图13:添加查询文本框和按钮
此时程序的页面可视化设计就完成了,接下来实现一个按照用户在文本框中输入的成员姓氏查询成员信息的功能(删除、修改功能可以以类似方式实现)。
在页面视图区中点击底部的Code标签页

,页面视图区转到了Code视图,可以看到WebMatrix界面左边的工具箱中出现了代码向导(Code Wizard)一栏,如图14所示。

图14:代码向导栏
可以看到"代码向导"提供了几种基本的数据操作(比如SELECT、INSERT、DELETE、UPDATE等)代码向导,双击其中的"SELECT Data Method",可以看到屏幕弹出一个查询代码添加向导对话框,如图15。

图15:查询代码添加向导对话框
依照该向导顺序操作,
1) 选择要进行查询操作的数据库(ADDRBOOK.MDB),如图15;
2) 选择要在查询结果中显示的数据项(成员编号、名字、姓氏、角色等),如图16;

图16:选择要在查询结果中显示的数据项
3) 点击WHERE按钮,选择要查询的数据项和查询条件(姓氏),如图17;

图17:选择要查询的数据项和查询条件
4) 完成设置后点击Next按钮进入查询测试对话框,点击Test Query按钮进行查询测试,输入编号"赵",可以看到姓赵的成员信息被显示出来,这说明测试成功,如图18;

图18:测试查询结果
5) 最后设置生成的查询方法的名称(缺省为MyQueryMethod)和返回类型(缺省为DataSet),如图19;

图19:设置生成的查询方法名称和返回类型
6) 完成设置后回到Code视图,可以看到WebMatrix自动生成的MyQueryMethod方法源代码,如图20。

图20:生成的查询方法源代码
接下来是最后一步,把查询按钮的点击事件与查询方法关联起来。
点击页面视图区底部的Design标签页

回到Design视图,双击前面添加到页面上的"查询"按钮,可以看到页面视图区由Design视图转到了Code视图,WebMatrix自动为"查询"按钮的Click事件创建了一个函数--void Button1_Click(object sender, EventArgs e),函数体尚无内容。在函数体中添入两行代码:
DataGrid1.DataSource = MyQueryMethod( TextBox1.Text ); DataGrid1.DataBind(); |
整个开发过程就完成了,如图21所示。

图21:为查询按钮的点击事件添加关联代码
点击工具条上的运行按钮
运行程序,可以看到运行效果,页面出现了文本框和查询按钮,在文本框中输入"赵",点击"查询"按钮后,数据表中所有姓"赵"的成员的信息被查出并显示在了页面上,如图22。

图22:程序按姓氏进行条件查询的运行效果
如果觉得页面中DataGrid的显示效果难看的话,可以很方便进行调整修饰。
回到WebMatrix中的程序页面设计视图窗口,点击页面上的控件DataGrid1,可以看到WebMatrix右下区域的属性设置区中出现了对DataGrid的各种属性设置项,最简便的修饰外观的方法是点击该区域下部的"Auto Format…"链接,从弹出的自动格式设置对话框中选择一种喜欢的外观样式就可以了,如图23所示。

图23:DataGrid的外观设置
再次运行,可以看到界面显示效果已经自动进行了修饰,如图24所示。

图24:加入修饰效果后的数据查询程序页面运行效果
结束语
至此,相信你已经领会到了WebMatrix的强大功能了,回过头来想一想,真有点不敢相信这个东西居然只有2.8M。
WebMatrix在ASP.NET程序代码处理上与VS.NET的不同之处在于WebMatrix将程序的逻辑处理代码与页面静态代码放在一个文件中,而不像VS.NET那样做到了数据与显示的分离。因此,在程序员与网页美工的配合上会麻烦一点,但对于开发中小型系统来说,这并不是很大问题。
总而言之,WebMatrix是一款小巧灵活、功能强大的基于Web的ASP.NET应用系统开发工具,虽然相对VS.NET来说它还是一个非常轻量级的开发工具,但其自身相当有特点,很多功能并不逊于VS.NET,对于中小型的系统开发来说它是一个不错的选择,而且最重要的是--它是免费的。
查看本文来源