ASP.NET MVC Grid View - Use Drag-and-Drop To Add/Remove Columns (available now in v2011.1)

ASP.NET Team Blog
15 March 2011

Check out the new "Customization Window" feature of the DevExpress MVC GridView extension in DXperience v2011 volume 1:

ASP.NET MVC_GridView_Customization_Window

Drag-and-Drop Columns

The new feature allows you to drag-and-drop column from the MVC GridView on to a customization window. This customization window displays the hidden column headers.

And it's an easy way for your end-users to customize the grid's layout:

  • To hide a grid column, drag its header to the customization window
  • To make a column visible, drag its header from the customization window back to the Grid View's header panel

Set Popup Location

The popup Customization window can be customized too. Use the SettingsCustomizationWindow property to specify the customization window's availability and position.

Client-Side API

Use the following client-side methods to control the customization window's visibility:

  • ShowCustomizationWindow()
  • HideCustomizationWindow()
  • IsCustomizationWindowVisible()

Enable With One Line

To enable the customization window feature, just set the SettingsCustomizationWindow property to true:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>

<% 
    Html.DevExpress().GridView(
        settings =>
        {
            settings.Name = "grid";
            settings.CallbackRouteValues = new { Controller = "GridView", Action = "CustomizationWindowPartial" };
            settings.ClientSideEvents.CustomizationWindowCloseUp = "grid_CustomizationWindowCloseUp";
            settings.Width = Unit.Percentage(100);
            settings.SettingsCustomizationWindow.Enabled = true;
            settings.Settings.ShowGroupPanel = true;

            settings.Columns.Add("ContactName");
            settings.Columns.Add("CompanyName");
            settings.Columns.Add("City");
            settings.Columns.Add("Region").Visible = false;
            settings.Columns.Add("Country");
        })
        .Bind(Model)
        .Render();
%>

What do you think of the "Customization Window" feature of the DevExpress MVC GridView extension? Download DXperience v2011.1 or great and drop me a line below with your thoughts.

Thanks!

Build Your Best - Without Limits or Compromise

Try the DevExpress ASP.NET MVC Extensions online now: http://mvc.devexpress.com

Read the latest news about DevExpress ASP.NET MVC Extensions

Download a free and fully-functional version of DXperience now: http://www.devexpress.com/Downloads/NET/

Follow MehulHarry on Twitter

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.