使用回调技术实现局部刷新
使用回调技术实现局部刷新,它只要是实现了ICallbackEventHandler这个接口,使用接口中的RaiseCallbackEvent
事件和GetCallbackResult()方法,最后用javaScript脚本来调用
以下是前台Default.aspx.cs代码:
1
using System;
2using System.Data;
3using System.Configuration;
4using System.Collections;
5using System.Web;
6using System.Web.Security;
7using System.Web.UI;
8using System.Web.UI.WebControls;
9using System.Web.UI.WebControls.WebParts;
10using System.Web.UI.HtmlControls;
11
12
13
/// <summary>
14
/// 功能:利用ICallbackEventHandler回调事件接口实现一个局部
15/// 刷新
16///
17/// 时间:二00八年二月二十日
18///
19/// 作者:曹代明
20
/// </summary>
21public partial class February_AJAX_Default : System.Web.UI.Page,ICallbackEventHandler
22{
23 private string _data;
24 protected void Page_Load(object sender, EventArgs e)
25
{
26
}
27
28
ICallbackEventHandler 成员
54}
55
using System;2
using System.Data;3
using System.Configuration;4
using System.Collections;5
using System.Web;6
using System.Web.Security;7
using System.Web.UI;8
using System.Web.UI.WebControls;9
using System.Web.UI.WebControls.WebParts;10
using System.Web.UI.HtmlControls;11
12
13
/// <summary>
14
/// 功能:利用ICallbackEventHandler回调事件接口实现一个局部15
/// 刷新16
/// 17
/// 时间:二00八年二月二十日18
/// 19
/// 作者:曹代明20
/// </summary>21
public partial class February_AJAX_Default : System.Web.UI.Page,ICallbackEventHandler22
{
23
private string _data;24
protected void Page_Load(object sender, EventArgs e)25
{26
}27
28
ICallbackEventHandler 成员54
}55
以下是后台Default.aspx代码:
1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="February_AJAX_Default" %>
2
3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5<html xmlns="http://www.w3.org/1999/xhtml" >
6<head runat="server">
7 <title>无标题页</title>
8 <script type="text/javascript">
9 function FillData()
10 {
11 var city=document.getElementById("TextBox1").value;
12
13 <% =this.ClientScript.GetCallbackEventReference(this,"city","FillDll",null) %>;
14 }
15 function FillDll(strcity)
16 {
17 document.getElementById("DropDownList1").options.length=0;
18 var indexofcity;
19 var city;
20 //切割传递来的字符串
21 while(strcity.length>0)
22 {
23 //判断是否是最后一个字符串
24 indexofcity=strcity.indexOf(",");
25 if(indexofcity >0)
26 {
27 city=strcity.substring(0,indexofcity);
28 strcity=strcity.substring(indexofcity+1);
29 //填充下拉框
30 document.getElementById("DropDownList1").add(new Option(city,city));
31 }
32 else
33 {
34 // 如果是最后一个字符串
35 document.getElementById("DropDownList1").add(new Option(strcity,strcity));
36 break;
37 }
38 };
39 }
40 </script>
41</head>
42<body>
43 <form id="form1" runat="server">
44 <div>
45 <table style="width: 504px; height: 151px">
46 <tr>
47 <td colspan="2" style="font-weight: bold; color: #3300ff; text-align: center">
48 使用回调技术实现局部刷新</td>
49 </tr>
50 <tr>
51 <td style="width: 135px">
52 输入城市名称</td>
53 <td style="width: 3px">
54 <asp:TextBox ID="TextBox1" runat="server" Width="233px"></asp:TextBox></td>
55 </tr>
56 <tr>
57 <td style="width: 135px">
58 </td>
59 <td style="width: 3px">
60 <input id="Button1" style="width: 131px" type="button" value="查询" onclick="FillData()"/></td>
61 </tr>
62 <tr>
63 <td style="width: 135px">
64 选择区域列表</td>
65 <td style="width: 3px">
66 <asp:DropDownList ID="DropDownList1" runat="server" Width="237px">
67 </asp:DropDownList></td>
68 </tr>
69 </table>
70
71 </div>
72 </form>
73</body>
74</html>
75
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="February_AJAX_Default" %>2
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">4
5
<html xmlns="http://www.w3.org/1999/xhtml" >6
<head runat="server">7
<title>无标题页</title>8
<script type="text/javascript">9
function FillData()10
{11
var city=document.getElementById("TextBox1").value;12
13
<% =this.ClientScript.GetCallbackEventReference(this,"city","FillDll",null) %>;14
}15
function FillDll(strcity)16
{17
document.getElementById("DropDownList1").options.length=0;18
var indexofcity;19
var city;20
//切割传递来的字符串21
while(strcity.length>0)22
{23
//判断是否是最后一个字符串24
indexofcity=strcity.indexOf(",");25
if(indexofcity >0)26
{27
city=strcity.substring(0,indexofcity);28
strcity=strcity.substring(indexofcity+1);29
//填充下拉框30
document.getElementById("DropDownList1").add(new Option(city,city));31
}32
else33
{34
// 如果是最后一个字符串35
document.getElementById("DropDownList1").add(new Option(strcity,strcity));36
break;37
}38
};39
}40
</script>41
</head>42
<body>43
<form id="form1" runat="server">44
<div>45
<table style="width: 504px; height: 151px">46
<tr>47
<td colspan="2" style="font-weight: bold; color: #3300ff; text-align: center">48
使用回调技术实现局部刷新</td>49
</tr>50
<tr>51
<td style="width: 135px">52
输入城市名称</td>53
<td style="width: 3px">54
<asp:TextBox ID="TextBox1" runat="server" Width="233px"></asp:TextBox></td>55
</tr>56
<tr>57
<td style="width: 135px">58
</td>59
<td style="width: 3px">60
<input id="Button1" style="width: 131px" type="button" value="查询" onclick="FillData()"/></td>61
</tr>62
<tr>63
<td style="width: 135px">64
选择区域列表</td>65
<td style="width: 3px">66
<asp:DropDownList ID="DropDownList1" runat="server" Width="237px">67
</asp:DropDownList></td>68
</tr>69
</table>70
71
</div>72
</form>73
</body>74
</html>75
