动态网页设计实训指导书

动态网页设计(asp.net)实训指导书编写：颜煜二00三年八月2编写说明本课程实验实训指导书是我们根据教学的需要，在试用的基础上，编写了这套实验实训指导书。其中包括实验实训8个，内容包括.NET基本知识，简单网站开发设计，asp.net内置对象的使用，数据访问技术ADO.NET及综合系统的开发实训等。目的是使学生通过实验实训，加深对HTML标记语言，C#程序设计，基本控件的使用，用户界面交互及网页间的数据传递，使用Web服务器常用控件，状态管理对象的应用，设计数据库应用网站，ASP.NET技术综合应用的理解，并将其运用到实际的工作当中，增强学生的实践能力，培养创新精神。3目录一．实训1创建asp.netWeb应用程序…………………………………1二.实训2Web应用程序的界面设计……………………………………6三.实训3Web应用程序的界面设计……………………………………10四.实训4Web应用的状态管理…………………………………………21五.实训5Web应用的状态管理…………………………………………………28六.实训6Web应用开发中的数据访问….………………………………41七.实训7主题母页和用户控件…………………………………………48八.实训8.NET中数据库程序设计………………………………………541实训1创建asp.netWeb应用程序一.实训目的：1.掌握IIS的基本配置方法2.熟悉.NET开发环境二.实训内容：1.IIS的安装IIS是Windows操作系统的一个服务器组件，默认情况下，除了Server系统以外，该组件是不会随系统而安装的，需要另外添加，添加方法为找开控制面版，选择添加删除程序，选择添加删除Windows组件中的“Internet信息服务(IIS)”后单击“下一步”完成安装。2.IIS基本配置（1）打开IIS服务管理器，方法为选择开始菜单——设置—控制面板，在控制面板窗口中选择管理工具项目，在管理工具项目窗口中选择Internet信息服务项目，并双击将其打开（如图ST1-1,ST1-2所示）图ST1-1图ST1-2（2）在IIS信息服务窗口中展开网站，在展开的选项中选择默认网2站项，然后单击鼠标右键在出现菜单中选择属性，出现默认网站属性窗口(如图ST1-3所示)图ST1-3（3）默认网站属性窗口中选择网站选项卡，在此选项卡中可以设置此服务器的IP地址，如果此服务器作为单机使用，网络中其它客户机无法访问此服务器可以在此选项卡中IP地址项文本框中选择“全部未分配”，则访问此服务器可以使用如下地址访问进行。如果作为一个可以被网络中其它客户机访问的服务器，在IP地址项文本框中选择IP地址即可（单击该文本框旁边的箭头进行选择）（如图ST1-3所示）（4）然后在默认网站属性窗口中选择主目录选项卡，在选项卡中指定此服务器页面程序文件的存放路径。设置方法为在此选项卡中的本地路径项中指定一个目录路径（默认路径为系统盘的Inteput目录下的目录），如F:\myweb(即在F盘下新建一个myweb目录)，可以使用浏览按钮进行选择。还可以设置本服务器的文件访问权限，这些可以在此选项卡中一些复选框中进行选择。如目录浏览项目录可以控制客户机是否可以查看服务器主目录中的文件列表，读取和写入这两个选项可以控制对服务器主目录文件的读写权限（如图ST1-4所示）。3图ST1-4（5）然后可以指定客户机访问服务器时第一个被访问页面文件，这个项目需要在默认站点属性窗口中文档选项卡中进行添加。（如图ST1-5所示）（6）设置完所有属性后，单击确定按钮完成设置。图ST1-52.编写简单的ASP.NET应用程序具体的步骤：第一步：新建网站第二步：创建Web页面第三步：添加控件及设置属性第四步：添加事件代码第五步：调试运行任务一：设计一个单页Web应用程序，网页界面由1个表格、1个标签（Label）、2个文本框和1个命令按钮（Button）组成，另外还包含若干文字。设计界面如图1.10所示。1．创建应用程序界面4（1）创建Web应用程序项目。启动VisualStudio2008，选择“新建/项目”，项目类型选择“Web”，模板选择“ASP.NETWeb应用程序”，然后指定该应用程序的保存路径，确定后系统则新建了一个解决方案（默认名为WebApplication1），该解决方案中包含一个Web项目（默认名为WebApplication1），该项目中包含一个网页文件（默认名为Default.aspx），此时屏幕上会出现一个空白窗体（2）向网页中添加控件。将Default.aspx改名为Login.aspx，对于本例界面，首先使用“表/插入表”菜单命令，插入一个2行2列的表格，居中显示。然后使用工具箱中标签（Label）、文本框（TextBox）和按钮（Button）3种控件放入表格中：先将光标定位到表格的单元格中，将鼠标移到左侧“工具箱”位置，自动弹出“工具箱”窗口，选择其中的“TextBox”控件对象，然后双击即可在网页中放入一个文本框对象，完成后的效果如图1.11所示。按类似的操作方法可分别添加标签和按钮，完成后的界面如图1.10所示。2．设置控件的属性可以通过属性窗口为控件设置属性。单击按钮“Button1”，在“属性”窗口中出现按钮“Button1”的所有属性，在“属性”窗口中滚动属性列表，选定属性名“Text”，在右列中输入属性值为“确定”，属性窗口的设置如图1.12所示。另外将输入密码的文本框的TextMode属性设置为Password。3．编写程序代码为按钮对象“确定”添加鼠标单击事件代码有两种方法：（1）双击要编写代码的命令按钮，系统自动打开代码编辑器，并出现如下代码行：protectedvoidButton1_Click(objectsender,EventArgse)5{}（2）在Button控件的属性窗口中，单击“”图标，添加Click事件方法“Button1_Click”，双击则系统自动切换到代码编辑器并生成如（1）所示的代码。也可以直接双击Click事件所要输入的空白响应方法，系统自动生成Button1_Click方法。在事件代码中输入如下的程序代码：protectedvoidButton1_Click(objectsender,EventArgse){if((TextBoxName.Text==admin)&&(TextBoxPwd.Text==admin)){Label1.Text=欢迎进入论坛系统;}else{Label1.Text=用户名或密码错！;}4．保存应用程序使用“文件”菜单中的“全部保存”命令或单击工具栏上的“全部保存”按钮，可以将所有编辑过的代码和设计的网页存盘。5．运行和调试程序（1）右键单击项目中的aspx网页文件，在弹出的快捷菜单中选择“在浏览器中查看”选项即可浏览选择的网页。（2）从“调试”菜单中选择“开始执行（不调试）”命令。（3）单击工具栏中的按钮。（4）按Ctrl+F5组合键。运行程序后，即显示网页界面，输入用户名“admin”，密码“admin”，单击“确定”按钮，标签中将显示“欢迎进入论坛系统”，如图1.13所示图1.13实例运行效果三、思考与练习1.如何配置.NET的运行环境及调试一个简单的ASP.NET程序。6实训2Web应用程序的界面设计一.实训目的：1、掌握文本类型控件的常用属性，事件，方法的设置方法2．能熟练掌握Label,TextBox,Button控件的使用二.实训内容：任务一：设计一个模拟的用户登录页面，当用户名文本框为空时，输出“请输入用户名“，当输入用户名，按Enter键或单击页面空白处时，则在页面中输出欢迎信息”尊敬的用户ⅩⅩⅩ你好！“具体操作步骤：1.建立网站：2.设计页面3.添加控件及置属性各控件对象的属性设置：控件属性值说明TextBox1IDtxtName文本框1的名字AutoPostBackTrue文本修改后，数据自动回传给服务器Label1IDlblInfo标签控件在程序中使用的名字Text标签倥件初始状态不显示文本4.编写事件代码usingSystem;usingSystem.Configuration;usingSystem.Data;usingSystem.Linq;usingSystem.Web;usingSystem.Web.Security;7usingSystem.Web.UI;usingSystem.Web.UI.HtmlControls;usingSystem.Web.UI.WebControls;usingSystem.Web.UI.WebControls.WebParts;usingSystem.Xml.Linq;publicpartialclass_Default:System.Web.UI.Page{protectedvoidPage_Load(objectsender,EventArgse){this.Title=文本类型控件学习页面;txtName.Focus();if(txtName.Text.Trim()==){lblInfo.Text=请输入用户名;}}protectedvoidTextBox1_TextChanged(objectsender,EventArgse){if(txtName.Text.Trim()==){lblInfo.Text=请输入用户名;}else{lblInfo.Text=尊敬的用户+txtName.Text+你好！;}}}程序说明：1.在asp.net中，字符串连接用“+“。2.Focus()此方法用于获取光标的焦点。3.Trim()为了避免用户输入若干空格来通过程序判断，所以在获取文本框的值时调用Trim()方法，将字符串前后的空格移除，即从当前String对象中移除所有前导空白字符和尾部空白字符，避免空格对程序产生的影响。任务二：创建一个“用户管理“的页面，要求当输入用户名，密码，联系电话，个8人描述后，单击”添加“按扭，用户管理信息就会在下方的Label控件中显示，程序运行效果如图：具体操作步骤：1.建立网站：2.设计页面3.添加控件及设置属性4.编写事件代码usingSystem;usingSystem.Configuration;usingSystem.Data;usingSystem.Linq;usingSystem.Web;usingSystem.Web.Security;usingSystem.Web.UI;usingSystem.Web.UI.HtmlControls;usingSystem.Web.UI.WebControls;usingSystem.Web.UI.WebControls.WebParts;usingSystem.Xml.Linq;publicpartialclass_Default:System.Web.UI.Page{9protectedvoidPage_Load(objectsender,EventArgse){}protectedvoidButton1_Click(objectsender,EventArgse){if((TextBox1.Text.Trim()==)||(TextBoxpwd.Text.Trim()==)||(TextBox2.Text.Trim()==)||(TextBox3.Text.Trim()==)){Label1.Text=输入框不能为空,请输入完全;}else{Label1.Text=TextBox1.Text+你的密码是：+TextBoxpwd.Text+联系电话：+TextBox2.Text+个人描述：+TextBox3.Text;}}}三、思考与练习1.如何灵活运用Label,TextBox,Button等控件。10实训3Web应用程序的界面设计一.实训目的：1、掌握选择类型类型控件的常用属性，事件，方法的设