Working with the FloatingPanel control

---

Accessing controls by ID

FloatingPanel floatingpanel = (FloatingPanel)map.FindControl("FloatingPanel1");
Toc toc = (Toc)floatingpanel.FindControl("Toc1");

At runtime, the visibility of a FloatingPanel can be changed using Web ADF JavaScript available in the Web browser. A callback to the Web application is not required. JavaScript support for FloatingPanel capabilities in the Web browser is provided in the display_floatingpanel.js file. By default, during application initialization, the JavaScript file will be streamed to the client as an embedded resource. The JavaScript file is only available if a FloatingPanel resides on the page. The display_floatingpanel.js file contains a set of functions to change the visibility of a FloatingPanel at runtime. 

The JavaScript functions and descriptions are shown in the following table. Nearly all functions accept a single parameter, the unique client ID of the FloatingPanel.

JavaScript function name	Description
showFloatingPanel	Shows a floating panel.
hideFloatingPanel	Hides a floating panel.
toggleFloatingPanelVisibility	Shows or hides a floating panel, (changes to the opposite of a floating panel's current state).
expandFloatingPanel	Expands a floating panel to view its content.
collapseFloatingPanel	Collapses a floating panel to hide its content (still shows the title bar).
hideAllFloatingPanels	Hides all floating panels on the page (no parameter required).

The following code examples shows a Web page (*.aspx) that contains a FloatingPanel and a Hypertext Markup Language (HTML) input button. When the button is clicked at runtime, it calls the toggleFloatingPanelVisibility JavaScript function and passes the FloatingPanel ID ('MyFloatingPanel') to change visibility. If the FloatingPanel is visible, it will be hidden. If the FloatingPanel is hidden, it will be visible.  

<esri:floatingpanel id="MyFloatingPanel" Width="200px" Height="200px" 
BorderColor="Black" BorderWidth="2px" runat="server" 
style="left: 111px; position: absolute; top: 60px"> </esri:floatingpanel>
 
<input id="MyHTMLButton" type="button" value="HTML Button" 
onclick="javascript: toggleFloatingPanelVisibility('MyFloatingPanel')" />

The following screen shot shows the results of the preceding code example:

 

If the visibility of the FloatingPanel needs to change during a callback to the Web ADF application, a custom CallbackResult can be used. For more information on CallbackResults and Web ADF controls, see Ajax capabilities in the Web ADF.

The following code example shows a map action on the Map control in the Web browser that has triggered a callback. The map action is handled by a custom tool in the Web application. Since the callback response is being handled by the Map control, a custom CallbackResult to change the FloatingPanel visibility needs to be created and added to the Map control's callback results collection. 

The following code example, in the server action class for the custom tool, shows how to create the custom CallbackResult and add it to the Map control (mapctrl) callback results collection.

The custom CallbackResult includes a JavaScript call to the showFloatingPanel() function in the Web browser and passes the client ID of the FloatingPanel ('MyFloatingPanel') to display. This JavaScript call is executed when the callback response is returned to the Web browser and the Web ADF function, processCallbackResult, processes the callback results. 

CallbackResult callbackresult = new CallbackResult(null, null, "javascript", 
    "showFloatingPanel('MyFloatingPanel');");
mapctrl.CallbackResults.Add(callbackresult);