65.9K
CodeProject 正在变化。 阅读更多。
Home

Web 窗体之间的事件

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.59/5 (12投票s)

2007年7月6日

CPOL

4分钟阅读

viewsIcon

44577

downloadIcon

989

使用 CallBacks 或 Ajax 引发 Web 窗体之间的事件。

Screenshot - Events_Between_Web_Forms.gif

引言

我在Windows应用程序中经常使用的一个非常有用的功能是在窗体之间触发事件或从一个窗体向另一个窗体发送消息。然后,我可以在接收窗体中执行某些操作,例如重新加载一些数据、填充一些字段、进行一些计算等。对于Web窗体来说,由于Web应用程序的工作方式,这个过程并不那么直接。

背景

我见过几种克服此限制的方法。最流行的方法是使用JavaScript访问打开窗口中的元素并修改其值。另一种方法是使用`Server.Transfer`方法并访问前一页的`ViewState`。但是,这种方法会降低Web应用程序的安全性,因为必须禁用`ViewState`哈希才能使其工作。随后,您必须离开当前页面才能显示新页面。您还可以使用查询字符串在窗体之间传递消息,然后自动刷新整个页面、打开者或子页面。我知道还有许多其他的方法,但这些是最常见的。

Using the Code

我针对这个问题使用了两种方法。第一种是使用ASP.NET回调,另一种是使用Web服务和Ajax。当然,这两种方法可以一起使用。事实上,我没有实现一个纯粹的Ajax+WS示例。无论如何,这两种方法都使用Javascript,所以对于像我一样讨厌它的人来说,我很抱歉。

示例代码有两个版本;两者执行相同的操作。一个使用VB.NET,另一个使用C#。VB.NET版本是一个Web应用程序项目,因此您必须安装VS 2005的SP1或支持Web应用程序项目的更新。您可以在这里找到两者这里。C#代码是一个网站项目。正如我所说,两个示例都执行相同操作。请注意,此示例代码是为了向您展示如何在Web窗体之间实现或模拟事件,因此请不要介意我实现“保存数据”部分的粗略方式。

使用回调

要使用回调,您必须在您的类中实现`System.Web.UI.ICallbackEventHandler`并实现两个方法:`RaiseCallbackEvent`和`GetCallbackResult`。

对于类

Partial Class ClientCallback
    Inherits System.Web.UI.Page
    Implements System.Web.UI.ICallbackEventHandler

方法

Public Sub RaiseCallbackEvent(ByVal eventArgument As String) _
    Implements System.Web.UI.ICallbackEventHandler.RaiseCallbackEvent   
    
Public Function GetCallbackResult() _
    As String Implements _
    System.Web.UI.ICallbackEventHandler.GetCallbackResult

我知道你们很多人以前都用过这个。在打开窗口中触发事件的技巧在于JavaScript代码。

子窗口的JavaScript代码

//Receives the CallBack Result

function ReceiveCallBackResult(result)
{   
    //Inform the user

    document.getElementById("ResultsSpan").innerHTML = result;
    //UserAdded

    window.opener.UserAddedEvent(result);
}

父窗口的JavaScript代码

//Receive some data from the child window

function UserAddedEvent(result)
{
    //Message about the Last User Added

    document.getElementById("UserAdded").innerHTML = result;

     //Reload the user list

     ReloadUserList();
}
//Reloads the User list with a Callback

function ReloadUserList()
{
    //Make the callback to the server

    CallServer("", "");
}

如您所见,从子窗口调用的JavaScript函数调用打开窗口中的一个函数,该函数又调用另一个函数。这会在打开窗口中对服务器进行回调。

使用Ajax + Web服务

使用Ajax + Web服务与使用回调非常相似。技巧在于JavaScript代码。您必须使Web服务调用能够从JavaScript访问。为此,您必须向脚本管理器添加一个脚本引用。将以下内容放入`Page.Load`

'Set up the Reference

Dim TestWS As ServiceReference = New ServiceReference
TestWS.Path = "~/WSUsers.asmx"
'Add the WS reference  to the script manager

objScriptManager.Services.Add(TestWS)

接下来,将此JavaScript代码添加到您想要进行WS调用的元素中

onclick="AddUser();"

现在进行对WS的调用

//Adds the user

function AddUser()
{
    CallBacks.WSUsers.AddUser(document.getElementById(
        "txtName").value,document.getElementById(
        "txtAge").value,SucceededCallback);
}

此函数在对WS的调用完成后被调用

// Callback function 

function SucceededCallback(CallBackResult, eventArgs)
{
        //Inform the user

        document.getElementById("ResultsSpan").innerHTML = CallBackResult;
        //UserAdded

        window.opener.UserAddedEvent(CallBackResult);
}

如您所见,一旦调用了WS,其余过程与回调相同。您也可以在打开窗口中对Web服务进行调用。一个有趣的方法是发送HTML作为Web服务的响应,并将该HTML作为元素的`innerHTML`。

关注点

使用回调的一个限制是我们只能发送和接收字符串。因此,如果您想在回调中发送多个值,则必须使用您喜欢的任何分隔符。回调响应也是如此。我知道你们许多使用过回调和Ajax + Web服务的人可能会认为这段代码有点令人失望。这段代码的有趣之处在于它将所有内容整合在一起并提供一些很酷的功能。对于初学者来说,它也很容易实现。我没有见过针对Web窗体的类似内容,但我必须说我没有认真搜索,因为我也做了很多Windows窗体的工作。我经常在窗体之间使用事件,所以我想要将此功能“移植”到Web窗体。我很想听听你们用来模拟Web窗体之间事件的其他方法。

历史

  • 2007年7月6日 -- 发布原始版本:VB.NET代码V1.0,C#代码V1.0
© . All rights reserved.