Callback-Based Functionality
- 6 minutes to read
Some DevExpress MVC extensions can work in callback mode by requesting the server via their own callbacks. Using callbacks is an efficient way to load/update extension content on demand (to minimize the initial data transfer) or to perform some lengthy functional operations (such as file uploads).
The following requirements should be met for an extension that is used in callback mode.
An extension should be defined in a separate Partial View (.cshtml or .vbhtml).
Note
It is required that a Partial View contains only the extension definition code, without any additional markup.
The
SettingsBase.Name
property value should be the same between callbacks.- A Controller should contain an additional Action method to handle extension callbacks and route them directly to a Partial View containing the extension. This allows the extension render to be conditionally updated in response to the end-user action performed.
- Callback routing logic should be defined using a
CallbackRouteValues
property of an extension’s settings object (the[_ExtensionName_]Settings.CallbackRouteValues
property). This property allows the names of the callback handling Controller and Action to be specified.
Note that these requirements are not required for all extensions that support the use of callbacks. For instance, the UploadControl extension might not be declared within a Partial View - it is enough for it to properly implement a callback handler Action method and reference this method in the CallbackRouteValues
property’s value.
#Extensions That Can Use Callbacks
The table below lists DevExpress MVC extensions that support the use of callbacks.
Extension | Callback Mode Availability | Requirements for Callback Mode Realization |
---|---|---|
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Calendar | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Callback | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Chart | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Auto | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Data | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Date | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Dock | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Popup | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Gantt | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Grid | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Html | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the List | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Menu | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Nav | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Page | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Pivot | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Popup | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Popup | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Rich | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Scheduler | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Spreadsheet | |
Always | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Tree | |
Optional | Define extension in a separate Partial View. Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Tree | |
Optional | Implement an Action method within the Controller to handle extension callbacks. Specify the Controller and Action names via the Upload |
#jQuery AJAX callbacks
The following example illustrates how to load a GridView to a div element on a callback.
function OnClick(s, e) {
$.ajax({
type: "POST",
url: "@Url.Action("GridViewPartial")",
success: function(response) {
$("#container").html(response);
}
});
}
#Example
This example demonstrates how the use of callbacks can be implemented for the TreeView extension.
@Html.Partial("CallbacksPartial")
@Html.DevExpress().TreeView(
settings => {
settings.Name = "tvCallbacks";
settings.CallbackRouteValues = new { Controller = "TreeView", Action = "CallbacksPartial" };
}).BindToSiteMap("~/App_Data/Feature.sitemap", false).GetHtml()
public class TreeViewController: Controller {
public ActionResult Callbacks() {
return DemoView("Callbacks");
}
public ActionResult CallbacksPartial() {
return PartialView("CallbacksPartial");
}
}