Callback Panel - Example

This demo illustrates the ease with which you can update page content in response to client-side events via callbacks.

With the MVC Callback Panel, updating page contents (including our extensions) via callbacks is no longer a tedious task. To simplify things, this extension offers unified callback management, allowing its child elements to be updated in one shot. In addition, the Callback Panel extension provides a built-in Loading Panel and Loading Div elements that provide visual feedback whenever a callback is processed. You can customize the appearance of these elements as your needs dictate by using the extension's LoadingPanelImage, LoadingPanelImagePosition, LoadingPanelStyle, LoadingPanelText, and LoadingDivStyle properties.

In this demo, the Callback Panel extension (see the ExamplePartial partial view) contains elements that are used to display personal information on an employee selected within a list box. The Callback Panel's contents are updated on a callback - initiated by the list box's ValueChanged client-side event handler. The callback routing logic is specified via the panel's CallbackRouteValues property. Here's how it works. When the selected employee is changed, the panel's PerformCallback client method is called, passing the selected employee's ID as its parameter. The model is then updated with the employee information that corresponds to the passed ID (see the GetEmployee function). As a result, the CallbackPanel's content is updated with the newly retrieved employee information.