How to use Web ADF partial postback solution to interact with non-Web ADF content and manage the callback results

Summary
This topic describes how to use the Web Application Developer Framework (ADF) Asynchronous JavaScript and XML (AJAX) framework to interact with non-Web ADF content. In this case, updating text in four text boxes on the same Web page as the Map control. This topic is the third in a series of three related "How to" topics. The others are "How to add a custom toolbar item to a toolbar control" and "How to implement a custom solution to manage callback content."

Using the Web ADF partial postback solution

This topic illustrates how to manage callback content to update four ASP.NET label controls on the same Web page as the Map control. Each label represents the north, south, east, or west extent of the map. When the map extent changes, the text in each labels is updated to represent the current extent parameters.
A custom CallbackResult object for each label is created and appended to the callback result for the Map control. The Web ADF JavaScript function processCallbackResult() contains logic to process non-Web ADF content depending on the parameters provided.
Do the following steps to complete this task:
  1. Create a Web application using How to create a Web application with Web controls as a guide. At a minimum, add MapResourceManager, Map Control.
  2. On the aspx page, add four label controls, one on each side of the Map control as shown in the following code example:
[HTML] 
<asp:Label ID="LabelW" runat="server" Style="left: 50px; position: absolute; top: 292px"
Text="Label" Width="70px"></asp:Label>

<asp:Label ID="LabelN" runat="server" Style="left: 311px; position: absolute; top: 127px"
Text="Label" Width="60px"></asp:Label>
<asp:Label ID="LabelE" runat="server" Style="left: 565px; position: absolute; top: 291px"
Text="Label" Width="73px"></asp:Label>
<asp:Label ID="LabelS" runat="server" Style="left: 316px; position: absolute; top: 459px"
Text="Label" Width="66px"></asp:Label>
The Web page appears as shown in the following screen shot:
  1. Add a new event handler for an ExtentChanged event on the Map control. In the following code example, the name of the method is Map1_ExtentChanged:
[C#] 
protected void Map1_ExtentChanged(object sender, ExtentEventArgs extentEventArgs)
{
  1. Get the new map extent via the ExtentEventArgs parameter and set the labels on the server to store the north, east, south, and west values as shown in the following code example:
[C#] 
ESRI.ArcGIS.ADF.Web.Geometry.Envelope adfEnvelope = extentEventArgs.NewExtent;

// Set label text on the server.
LabelN.Text = adfEnvelope.YMax.ToString("N");
LabelE.Text = adfEnvelope.XMax.ToString("N");
LabelS.Text = adfEnvelope.YMin.ToString("N");
LabelW.Text = adfEnvelope.XMin.ToString("N");
  1. Update label text on the client via the Map control's callback results. Since the event was fired by the Map control, the map's callback results—including any you choose to add—are processed on the client without further action (such as, registering a script block or data item). A custom callback result is created to update each label and is added to the Map's callbackresults. See the following code example:
[C#] 
ESRI.ArcGIS.ADF.Web.UI.WebControls.CallbackResult updateLabelCallbackResult =
    ESRI.ArcGIS.ADF.Web.UI.WebControls.CallbackResult.CreateSetInnerContent(LabelN,
    adfEnvelope.YMax.ToString("N"));
Map1.CallbackResults.Add(updateLabelCallbackResult);
updateLabelCallbackResult =
    ESRI.ArcGIS.ADF.Web.UI.WebControls.CallbackResult.CreateSetInnerContent(LabelE,
    adfEnvelope.XMax.ToString("N"));
Map1.CallbackResults.Add(updateLabelCallbackResult);
updateLabelCallbackResult =
    ESRI.ArcGIS.ADF.Web.UI.WebControls.CallbackResult.CreateSetInnerContent(LabelS,
    adfEnvelope.YMin.ToString("N"));
Map1.CallbackResults.Add(updateLabelCallbackResult);
updateLabelCallbackResult =
    ESRI.ArcGIS.ADF.Web.UI.WebControls.CallbackResult.CreateSetInnerContent(LabelW,
    adfEnvelope.XMin.ToString("N"));
Map1.CallbackResults.Add(updateLabelCallbackResult);
Since layer visibility and rendering did not change, the Map control does not need to be explicitly refreshed. The following code example shows the callback result string:
[C#] 

    "[{\"id\":\"LabelN\",\"type\":\"Label\",\"action\":\"innercontent\",\"params\":[\"-70.00\"]},
{
     \
        
            "id\":\"LabelE\",\"type\":\"Label\",\"action\":\"innercontent\",\"params\":[\"312.00\"]},
    {
         \
            
                "id\":\"LabelS\",\"type\":\"Label\",\"action\":\"innercontent\",\"params\":[\"-217.00\"]},
        {
             \
                
                    "id\":\"LabelW\",\"type\":\"Label\",\"action\":\"innercontent\",\"params\":[\"101.50\"]}]"
  1. At runtime, the callback string generated by the custom CallbackResults enables the modification of non-Web ADF controls and elements. Upon the initial map extent change, the labels around the map are updated dynamically in the browser, without a full page postback. The following illustration shows a runtime example of the Web ADF application built in this topic:



See Also:

ASP.NET script callback solutions
How to add a custom toolbar item to a toolbar control
How to implement a custom solution to manage callback content