程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> ASP.NET 2.0 正式版中無刷新頁面的開發(示例代碼的補充)

ASP.NET 2.0 正式版中無刷新頁面的開發(示例代碼的補充)

編輯:.NET實例教程


原文請見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.w3.org/TR/xhtml1/DTD/xHtml1-transitional.dtd">
 4
 5<html XMLns="http://www.w3.org/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   &nb
sp;    {
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)"/>&nbsp;
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.Globalizati
on
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

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved