2、在web窗体前台页面中添加两个div(以查询的方式验证ajax的效果);
(1).在第一个div中拖入一个label控件,将其属性名称改为“ID”;一个textbox控件“txtStudentID” ;一个按钮,属性名:查询;
(2).在第二个div中拖入两个label控件,第一个属性名改为学生姓名,第二个用于显示查询结果,ID改为lblStudentName;
3、双击“查询”按钮进入后台添加后台代码:
View Code
1 protected void btnDemand_Click(object sender, EventArgs e) 2 { 3 using (SqlConnection conn = new SqlConnection()) 4 { 5 string conStr = @"Data Source=.\SQLEXPRESS;Initial Catalog=CRM;Persist Security Info=True;User ID=sa;Password=sa"; 6 conn.ConnectionString = conStr; 7 try 8 { 9 conn.Open(); 10 } 11 catch 12 { 13 return; 14 } 15 SqlCommand cmd = new SqlCommand(); 16 cmd.Connection = conn; 17 string sql = string.Format("select name from customer where ID='{0}' ", txtStudentID.Text); 18 cmd.CommandText = sql; 19 SqlDataReader dr = cmd.ExecuteReader();//SqlDataReader提供一种从SQLServer数据库中读取行的至今流的方式; 20 if (dr.Read()) 21 { 22 lblStudentName.Text = dr[0].ToString(); 23 24 } 25 dr.Close();//关闭SqldataReader; 26 } 27 }
4、执行查询;
5、在前台的最顶端拖入一个ScriptManager 控件(工具箱的AJAX Extensions中)一个UpdatePannel控件;并将两个div放进UpdatePannel控件的<ContentTemplate></ContentTemplate>中。(为了增加效果的明显度,在页面中可增加一个框架如: <iframe src="" width="1000" height="400"></iframe> )
6、再次运行,可发现当输入不同的ID 获取不同结果(局部刷新)的时候,下面的框架内容并为随之刷新,这就是使用ajax的不同之处;
View Code
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApp_ajax.WebForm1" %> 2 3 4 5 630 317 8 9