Client-Callback Implementation (Visual Basic) Example

  • Article

Demonstrates an ASP.NET Web page that implements a client callback. For more information, see Implementing Client Callbacks Programmatically Without Postbacks in ASP.NET Web Pages.

Example

Description

The following code example is in two parts. The first part of the example shows an ASP.NET Web page (the .aspx page). The second part shows the corresponding code-behind file (the .aspx.vb file).

Note

The example requires the page to be named ClientCallback.aspx and the code-behind file to be named ClientCallback.aspx.vb.

Code

<%@ Page Language="VB" AutoEventWireup="true" 
  CodeFile="ClientCallback.aspx.vb" Inherits="ClientCallback" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
  <title>Client Callback Example</title>
  <script type="text/javascript">
    function LookUpStock()
    {
        var lb = document.getElementById("ListBox1");
        var product = lb.options[lb.selectedIndex].text;
        CallServer(product, "");
    }

    function ReceiveServerData(rValue)
    {   
        document.getElementById("ResultsSpan").innerHTML = rValue;        
    }
</script>
</head>
<body>
  <form id="form1" runat="server">
    <div>
      <asp:ListBox ID="ListBox1" Runat="server"></asp:ListBox>
      <br />
      <br />
      <button type="Button" onclick="LookUpStock()">Look Up Stock</button>
      <br />
      <br />
      Items in stock: <span id="ResultsSpan" runat="server"></span>
      <br />
    </div>
  </form>
</body>
</html>

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

    Protected catalog As ListDictionary
    Protected returnValue As String
    Sub Page_Load(ByVal sender As Object, ByVal e As _
        System.EventArgs) Handles Me.Load
        Dim cbReference As String
        cbReference = Page.ClientScript.GetCallbackEventReference(Me, _
            "arg", "ReceiveServerData", "context")
        Dim callbackScript As String = ""
        callbackScript &= "function CallServer(arg, context) { " & _
            cbReference & "} ;"
        Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), _
            "CallServer", callbackScript, True)

        ' Populate List Dictionary with invented database data
        catalog = New ListDictionary()
        catalog.Add("monitor", 12)
        catalog.Add("laptop", 10)
        catalog.Add("keyboard", 23)
        catalog.Add("mouse", 17)

        ListBox1.DataSource = catalog
        ListBox1.DataTextField = "key"
        ListBox1.DataBind()
    End Sub

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

        If catalog(eventArgument) Is Nothing Then
            returnValue = "-1"
        Else
            returnValue = catalog(eventArgument).ToString()
        End If

    End Sub

    Public Function GetCallbackResult() _
    As String Implements _
    System.Web.UI.ICallbackEventHandler.GetCallbackResult

        Return returnValue

    End Function

End Class

Comments

The Web page emulates a database lookup to determine the number of items that are available, or in stock, for a series of products (monitors, keyboards, and so on). To simplify this code example, the database is represented by a dictionary list that contains a small set of items. For each item in the table, the key is the item name (such as monitor) and the value is the number of items that are in stock. In a production application, a database would be used instead.

When the page runs, a ListBox control is bound to the hash table so that the ListBox control displays the list of products. The page also contains a button element (not a button Web server control), whose onclick event is bound to a client function named LookUpStock. When users click the button, the button executes the LookUpStock function, which gets the current selection from the list box and then performs the client callback by calling the CallServer function.

The code-behind page adds client-side script to the page via the RegisterClientScriptBlock method. The script that is added to the page includes a function called CallServer, which gets the name of the method that will post back to the server from the GetCallbackEventReference method.

The client callback invokes the RaiseCallbackEvent method, which determines the available stock for the product passed to it. The GetCallbackResult method returns the value. Note that the arguments sent between the client script and the server code can only be strings. To pass in or to receive multiple values, you can concatenate values in the input or return string, respectively.

Security noteSecurity Note:

When you use this feature, there are potential security threats. Callback arguments are not validated and therefore should be considered unsafe. You should always check the contents of the arguments before using them. For details, see Script Exploits Overview.

See Also

Tasks

How to: Implement Callbacks in ASP.NET Web Pages

Concepts

Implementing Client Callbacks Programmatically Without Postbacks in ASP.NET Web Pages

Client Callback with Validation Implementation Example