Skip to main content

Built-in Export

  • 4 minutes to read

The ASP.NET MVC GridView extension allows users to export its data to a file or stream in CSV, DOCX, PDF, RTF, XLS, and XLSX format. GridView data exporting can be implemented using standard toolbar commands and the server and client API.

Note

The GridView extension does not support exporting in custom binding mode.

Requirements

Follow the instructions below to ensure the exporting functionality works correctly:

  • Exporting using the built-in toolbar commands and client-side API is disabled by default due to possible security issues. To enable this functionality, set the MVCxGridExportSettings.EnableClientSideExportAPI property to true.
  • The GridView extension should be inside the <form> form.

Standard toolbar commands

The GridView toolbar provides frequently used grid commands, including exporting commands. Specify a standard grid exporting command (listed below) using the GridViewToolbarItem.Command property setting. Refer to the Toolbar online demo for more information on using grid toolbars.

settings.SettingsExport.EnableClientSideExportAPI = true;
settings.Toolbars.Add(t => {
    t.EnableAdaptivity = true;
    t.Items.Add(GridViewToolbarCommand.ExportToPdf);
    t.Items.Add(GridViewToolbarCommand.ExportToXls);
});

MVCxGridView-ExportCommands

Context menu commands

The GridView allows users to export its data using the context menu commands. Use the ContextMenuInitialize property to add an Export item. To process the Export item click, handle the client-side ASPxClientGridView.ContextMenuItemClick and server-side ASPxGridView.ContextMenuItemClick events. Refer to the Context Menu online demo for more information on using the grid’s context menu.

ASPxGridView-Export-ContextMenu

@using (Html.BeginForm("ExportTo", "Customization")) {
    @Html.Partial("ContextMenuPartial", Model)
}

Export API

Execute the ExportTo(format) client method to implement grid data export.

@Html.DevExpress().GridView(settings => {
    settings.Name = "GridView";
    settings.SettingsExport.EnableClientSideExportAPI = true;
    ...
}).Bind(Model).GetHtml()
...
<div class="button">
    @Html.DevExpress().Button(s => {
        s.Name = "ExpBtn";
        s.Text = "Export";
        s.AutoPostBack = "false";
        s.ClientSideEvents.Click = "function(s,e){ GridView.ExportTo(ASPxClientGridViewExportFormat.Xls);}";
    }).GetHtml()

Export Master-Detail Records

The GridView’s master-detail records can be exported using the standard toolbar commands or client API.

Declare the master grid settings (a GridViewSettings type object) and an object the grid is bound to. We recommended declaring grid settings in the Controller code (or any other helper code) and passing them to the View code to avoid repeatedly declaring and initializing grid settings.

The master grid settings should contain export-specific settings and a delegate method assigned to the MVCxGridViewExportSettings.GetExportDetailGridViews property. Using this delegate method adds a bound to data detail grid to the GridViewExportDetailRowEventArgs.DetailGridViews collection.

Example

The code sample below demonstrates how to export the grid’s master-detail records.

MVCxGridView-MasterDetailExport

Note

Refer to the Export Master-Detail Records online demo to see this feature in action and review the full code sample.

Controller code:

public partial class ExportingController: DemoController {
        public ActionResult ExportDetails() {
            ViewData["exportMode"] = GridViewDetailExportMode.Expanded;
            return DemoView("ExportDetails", NorthwindDataProvider.GetCategories());
        }
        public ActionResult ExportDetailsMasterPartial(GridViewDetailExportMode? exportMode) {
            ViewData["exportMode"] = exportMode;
            return PartialView("ExportDetailsMasterPartial", NorthwindDataProvider.GetCategories());
        }
        public ActionResult ExportDetailsDetailPartial(int categoryID) {
            ViewBag.CategoryID = categoryID;
            return PartialView("ExportDetailsDetailPartial", NorthwindDataProvider.GetProducts(categoryID));
        }
    }

Partial View (Master Grid):

@Html.DevExpress().GridView(settings => {
    ...
    settings.SettingsExport.EnableClientSideExportAPI = true;
    settings.SettingsExport.ExcelExportMode = DevExpress.Export.ExportType.WYSIWYG;
    settings.SettingsDetail.ShowDetailRow = true;
    if(ViewData["exportMode"] != null)
        settings.SettingsDetail.ExportMode = (ViewData["exportMode"] as GridViewDetailExportMode?).Value;
    ...
    settings.Toolbars.Add(t => {
        t.EnableAdaptivity = true;
        t.Items.Add(GridViewToolbarCommand.ExportToPdf);
        t.Items.Add(GridViewToolbarCommand.ExportToXls);
        t.Items.Add(GridViewToolbarCommand.ExportToXlsx);
        t.Items.Add(GridViewToolbarCommand.ExportToDocx);
        t.Items.Add(GridViewToolbarCommand.ExportToRtf);
        t.Items.Add(GridViewToolbarCommand.ExportToCsv);
    });

    settings.SetDetailRowTemplateContent(c => {
        Html.RenderAction("ExportDetailsDetailPartial", new { CategoryID = DataBinder.Eval(c.DataItem, "CategoryID") });
    });
    settings.SettingsExport.GetExportDetailGridViews = (s, e) => {
        int categoryID = (int)DataBinder.Eval(e.DataItem, "CategoryID");
        GridViewExtension grid = new GridViewExtension(GridViewExportDemoHelper.CreateGeneralDetailGridSettings(categoryID));
        grid.Bind(NorthwindDataProvider.GetProducts(categoryID));
        e.DetailGridViews.Add(grid);
    };
}).Bind(Model).GetHtml()

Partial View (Detail Grid):

@Html.DevExpress().GridView(settings => {
   ...   
    settings.CallbackRouteValues = new { Action = "ExportDetailsDetailPartial", Controller = "Exporting", CategoryID = ViewBag.CategoryID };
    settings.KeyFieldName = "ProductID";
    settings.Columns.Add("ProductID");
    settings.Columns.Add("ProductName");
    settings.Columns.Add("UnitPrice");
    settings.Columns.Add("QuantityPerUnit");
    ...
}).Bind(Model).GetHtml()

GridViewExportHelper:

public static GridViewSettings CreateGeneralDetailGridSettings(int uniqueKey) {
    GridViewSettings settings = new GridViewSettings();
    settings.Name = "detailGrid" + uniqueKey;
    settings.Width = Unit.Percentage(100);

    settings.KeyFieldName = "ProductID";
    settings.Columns.Add("ProductID");
    settings.Columns.Add("ProductName");
    settings.Columns.Add("UnitPrice");
    settings.Columns.Add("QuantityPerUnit");

    settings.SettingsDetail.MasterGridName = "masterGrid";
    settings.Styles.Header.Wrap = DevExpress.Utils.DefaultBoolean.True;

    return settings;
}

Online Demos

Refer to the following online demos to see the data export in action:

Exporting Data to Different Formats

Export Master-Detail Records

Excel Data Aware Export

Export with Format Conditions

Export with Data Cell Bands