原文请见Leon.Zhou的:http://pfzhou.cnblogs.com/archive/2006/03/31/363342.html
下载了示例代码,并转换成VB了,AJAX功能测试成功。但遇到些小问题: Demo1很正常。 Demo2按Leon原来的写法testAJAX.aspx.vb中Line
22不成功。所以我直接在IDE环境中,修改button3的OnClientClick属性,见testAJAX.asp的Line
52。测试成功。 Demo3按原来的加入客户端属性无法成功,在testAJAX.aspx.vb中第20行并未起作用。不知道是什么原因。
因此我只有加上一个button3来引发客户端事件。 这是个很好的例子,值得学习,详细原理说明请见作者的原文。测试时,请在您项目的web.config中添加<add
name="NorthWind" connectionString="...相应的数据库连接串..."> testAJAX.aspx
1<%@ Page Language="VB" AutoEventWireup="false"
CodeFile="testAJAX.aspx.vb" Inherits="testAJAX" %> 2 3<!DOCTYPE
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5<html
xmlns="http://www./1999/xhtml"
> 6<head id="Head1" runat="server"> 7 <title>ASP.NET
2.0 页面提交无刷新演示</title> 8 <script type="text/javascript" language
="javascript"> 9 Function CallServer1()function
CallServer1(inputcontrol, context) 10 { 11
context.innerHTML = "<IMG SRC=images/pie.gif />Loading"; 12
arg = ServerMethod1| + inputcontrol.value; 13 <%=
ClientScript.GetCallbackEventReference(Me, "arg", "ReceiveServerData1",
"context")%>; 14 } 15 16 Function
ReceiveServerData1()function ReceiveServerData1(result, context) 17
{ 18 context.innerHTML = context.id + ":" + result; 19
} 20 21 Function CallServer2()function
CallServer2(obj) 22 { 23 context =
gridspan; 24 context.innerHTML = "<IMG SRC=images/pie.gif
/>数据加载中"; 25 arg = "ServerMethod2|" +
obj.value; 26 <%= ClientScript.GetCallbackEventReference(Me,
"arg", "ReceiveServerData2", "context")%>; 27 } 28
29 Function ReceiveServerData2()function ReceiveServerData2(result,
context) 30 { 31 context.innerHTML =
result; 32 } 33 34
</script> 35</head> 36<body> 37 <form
id="form1" runat="server"> 38 <div> 39
<h1>Demo1:html按钮提交数据</h1><br /> 40 <asp:TextBox
ID="TextBox1" runat="server"></asp:TextBox> 41 <input
id="Button1" type="button" value="提交到Label1" onclick="CallServer1(TextBox1,
Label1)"/> 42 <input id="Button2" type="button"
value="提交到Label2" onclick="CallServer1(TextBox1, Label2)"/> 43
<br /> 44 <asp:Label ID="Label1" runat="server"
Text="Label1:"></asp:Label> 45 <br /> 46
<asp:Label ID="Label2" runat="server"
Text="Label2:"></asp:Label> 47 </div> 48 <hr
/> 49 <div> 50
<h1>Demo2:服务器按钮提交数据</h1><br /> 51 <asp:TextBox
ID="TextBox2" runat="server"></asp:TextBox> 52 <asp:Button
ID="Button3" runat="server" Text="Button" OnClientClick="CallServer1(TextBox2,
Label3);return false;" /><br /> 53 <asp:Label ID="Label3"
runat="server" Text="Label3:"></asp:Label></div> 54
<hr /> 55 <div> 56
<h1>Demo3:下拉列表框和gridview绑定数据</h1><br /> 57
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ connectionStrings:NorthWind %>" 58
SelectCommand="select distinct(country) from
customers"></asp:SqlDataSource> 59 <asp:SqlDataSource
ID="SqlDataSource2" runat="server" ConnectionString="<%$
connectionStrings:NorthWind %>" 60 SelectCommand="select
customerid, companyname, country from customers where country=@Country"> 61
<SelectParameters> 62 <asp:ControlParameter
Name="Country" ControlID="DropDownList1" PropertyName="SelectedValue"
/> 63 </SelectParameters> 64
</asp:SqlDataSource> 65 <div> 66
<asp:DropDownList ID="DropDownList1" runat="server" Width="239px"
67 DataSourceID="SqlDataSource1" DataTextField="Country"
DataValueField="Country"> 68
</asp:DropDownList> 69 <input id="Button4" type="button"
value="刷新" onclick="CallServer2(DropDownList1)"/> 70
</div> 71 <br /> 72 <span
id="gridspan"> 73 <asp:GridView ID="GridView1"
runat="server" DataSourceID="SqlDataSource2" CellPadding="4" ForeColor="#333333"
GridLines="None"> 74 <FooterStyle BackColor="#990000"
Font-Bold="True" ForeColor="White" /> 75 <RowStyle
BackColor="#FFFBD6" ForeColor="#333333" /> 76
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy"
/> 77 <PagerStyle BackColor="#FFCC66"
ForeColor="#333333" HorizontalAlign="Center" /> 78
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White"
/> 79 <AlternatingRowStyle BackColor="White"
/> 80 </asp:GridView> 81 </span> 82
</div> 83
</form> 84</body> 85</html> 86 testAJAX.aspx.vb 1 2Imports
System 3Imports System.Data 4Imports System.Configuration 5Imports
System.Web 6Imports System.Web.Security 7Imports
System.Web.UI 8Imports System.Web.UI.WebControls 9Imports
System.Web.UI.WebControls.WebParts 10Imports
System.Web.UI.HtmlControls 11Imports System.IO 12Imports
System.Globalization 13 14Partial Public Class testAJAXClass
testAJAX 15 Inherits System.Web.UI.Page 16 Implements
ICallbackEventHandler 17 Protected Sub Page_Load()Sub Page_Load(ByVal
sender As Object, ByVal e As EventArgs) 18 注册客户端事件处理方法 19
似乎这句并没起作用,因此我别外加了一个button4来引发客户端事件 by AndyDavis 20
DropDownList1.Attributes.Add("onchange", "CallServer2(this)") 21
Button3的客户端事件可以直接在IDE中OnClientClick属性中设置,不需要在这里添加 by AndyDavis 22
Button3.Attributes.Add("onclick", "CallServer1(TextBox2, Label3);return
false;") 23 End Sub 24 25 Private serverReturn As
String 26 27 Public Function GetCallbackResult()Function
GetCallbackResult() As String Implements
ICallbackEventHandler.GetCallbackResult 28 为便于查看加载效果,添加延时 29
System.Threading.Thread.Sleep(2000) 30 31 Dim parts() As String =
serverReturn.Split("|"c) 32
根据传递的方法名进行调用,并传递相应的参数,目前只支持一个参数 33 Return
CStr([GetType]().GetMethod(parts(0)).Invoke(Me, New Object()
{parts(1)})) 34 End Function 35 36 37 Public Sub
RaiseCallbackEvent()Sub RaiseCallbackEvent(ByVal eventArgument As String)
Implements ICallbackEventHandler.RaiseCallbackEvent 38 serverReturn =
eventArgument 39 End Sub 40 41
根据从客户端传来的英文国家名或缩写,翻译成相应的中文国家名 42 Public Function ServerMethod1()Function
ServerMethod1(ByVal arg As String) As String 43 Dim s As String =
"" 44 Select Case arg.ToLower() 45 Case
"cn" 46 Case "china" 47 s =
"中国" 48 Exit Select 49 Case
"us" 50 s = "美国" 51 Exit
Select 52 Case Else 53 s =
"未知国家" 54 Exit Select 55 End Select 56
Return s 57 End Function 58 59
根据从客户端传来的值,对GridView的内容进行更新,并将更新后的GridView的html返回 60 Public Function
ServerMethod2()Function ServerMethod2(ByVal arg As String) As
String 61 DropDownList1.SelectedValue = arg 62
GridView1.DataBind() 63 64 Return RenderControl(GridView1) 65
End Function 66 67 Private Overloads Function RenderControl()Function
RenderControl(ByVal control As Control) As String 68 Dim writer1 As
StringWriter = New StringWriter(CultureInfo.InvariantCulture) 69 Dim
writer2 As HtmlTextWriter = New HtmlTextWriter(writer1) 70 71
control.RenderControl(writer2) 72 writer2.Flush() 73
writer2.Close() 74 75 Return writer1.ToString() 76 End
Function 77End Class 78
|