Grid View for APS.NET MVC - How to use the jQuery.ajax function with DevExpress MVC extensions

This example demonstrates how to use the jQuery.ajax function to load the GridView extension on a callback.

In this example, we handle a button's Click event to call the $.ajax() function. The function sends an AJAX (asynchronous HTTP) request to the GridViewPartial action and renders the action result (GridViewPartial.cshtml) to the div container.

<script type="text/javascript">
    function OnClick(s, e) {
        $.ajax({
            type: "POST",
            url: "@Url.Action("GridViewPartial")",
            success: function(response) {
                $("#container").html(response);
            }
        });
    }
</script>
@Html.DevExpress().Button(settings => {
    settings.Name = "MyButton";
    settings.Text = "Click Me!!!";
    settings.ClientSideEvents.Click = "OnClick";
}).GetHtml()

Files to Look At

• Index.cshtml(VB: Index.vbhtml)
• HomeController.cs (VB: HomeController.vb)
• GridViewPartial.cshtml(VB: GridViewPartial.vbhtml)

Documentation

• GridViewExtension
• ButtonSettings.ClientSideEvents

More Examples

• How to use the GridView extension in Full Screen mode (100% browser Width and Height)
• GridView - How to edit in memory data source
• How to bind GridView to XPO in Server Mode
• How to load MVC extensions using the CallbackPanel extension

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)