Built-in Exporting

• Aug 24, 2021
• 4 minutes to read

The ASP.NET MVC GridView extension allows exporting 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.

Supported Versions

The information in this topic applies to DevExpress ASP.NET MVC Grid View version 17.2 and later.

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.

Refer to the KA18639 knowledge base article to get more information on exporting GridView rows while retaining end-user modifications (such as sorting, grouping, filtering, selection).

• 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.

  • GridViewToolbarCommand.ExportToPdf
  • GridViewToolbarCommand.ExportToRtf
  • GridViewToolbarCommand.ExportToCsv
  • GridViewToolbarCommand.ExportToXls
  • GridViewToolbarCommand.ExportToXlsx
  • GridViewToolbarCommand.ExportToDocx
  Razor (View)

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

  

• Context menu commands

  The GridView allows exporting its data using the context menu commands. Use the GridViewSettings.FillContextMenuItems 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.

  • GridViewContextMenuCommand.ExportToPdf
  • GridViewContextMenuCommand.ExportToRtf
  • GridViewContextMenuCommand.ExportToCsv
  • GridViewContextMenuCommand.ExportToXls
  • GridViewContextMenuCommand.ExportToXlsx
  • GridViewContextMenuCommand.ExportToDocx

  

  Razor (View)

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

  Razor (Partial View)

  @Html.DevExpress().GridView(settings => {
      settings.Name = "gridView";
      settings.SettingsContextMenu.Enabled = true;
      settings.SettingsExport.EnableClientSideExportAPI = true;
      settings.SettingsExport.ExcelExportMode = DevExpress.Export.ExportType.DataAware;
      settings.FillContextMenuItems = (s, e) => {
          if(e.MenuType == GridViewContextMenuType.Rows) {
              var item = e.CreateItem("Export", "Export");
              item.BeginGroup = true;
              item.Image.IconID = DevExpress.Web.ASPxThemes.IconID.ExportExport16x16;
              e.Items.Insert(e.Items.IndexOfCommand(GridViewContextMenuCommand.Refresh), item);
              item.Items.Add(new GridViewContextMenuItem(GridViewContextMenuCommand.ExportToPdf) { Text = "Export to PDF" });
              item.Items.Add(GridViewContextMenuCommand.ExportToRtf).Text = "Export to RTF";
              item.Items.Add(e.CreateItem(GridViewContextMenuCommand.ExportToXls));
          }
      };
  }).SetEditErrorText(ViewData["EditError"] as string).Bind(Model).GetHtml()
  

• Exporting API

  Execute an appropriate client method to implement grid data exporting. See Member Table: Built-in Export for a list of available methods.

  The following example illustrates how to use client exporting methods:

  C#

  @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 which are listed above and in the Member Table: Built-in Export topic.

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.

Note

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

Controller code:

Razor

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):

Razor

@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):

C#

@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:

Razor

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

Member Table

• Member Table: Built-in Export