The DevExpress ASP.NET MVC CardView enables you to group the most important or frequently used grid commands, and expose them through customizable toolbars for efficient end-user access.
The CardView stores toolbars (which are MVCxCardViewToolbar class instances) in its Toolbars collection. You can add or remove toolbars, change their availability and position (Visible, Enabled, Position) and populate them with toolbar items (MVCxCardViewToolbarItem class instances) using the Items property. Toolbar items can trigger standard grid commands (that is, data item editing, deletion, creation, etc.) and any custom actions, if required.
Standard Toolbar Items
To make a toolbar item execute a standard command, set the item's Command property to the desired command name listed by the CardViewToolbarCommand enumeration. A standard toolbar item automatically displays the command-related text and image (optional). Clicking a standard toolbar item executes the corresponding grid command.
Custom Toolbar Items
If you need to perform a custom action, set a toolbar item's Command property to the Custom value (the default setting), specify a custom command name through the item's Name property and define item characteristics (such as text, image, etc.). Then handle the server ToolbarItemClick event or client ToolbarItemClick event (or both) to identify the triggered custom command by its name and execute the required action.
Note that toolbar items expose the Items property allowing you to create hierarchies of nested toolbar items of unlimited depth.
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
The source code files for this demo are installed (by default) in the following directory:
Open CS Solution
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxCardViewDemos