Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]Welcome to DevExpress .NET Documentation
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Collapse]ASP.NET WebForms Controls
   Getting Started
  [Expand]Reporting
  [Expand]Chart Control
  [Expand]Grid View
  [Collapse]Card View
   [Expand]Product Information
    Getting Started
   [Expand]Fundamentals
   [Collapse]Concepts
    [Expand]Binding to Data
    [Collapse]Data Representation Basics
     [Collapse]Columns
       Data Columns
      [Expand]Unbound Columns
       Accessing Columns
       Creating Columns and Binding Them to Data Fields
     [Expand]Customization Window
    [Expand]Focus and Navigation
    [Expand]Data Editing
    [Expand]Data Shaping and Manipulation
    [Expand]Data Formatting
     Appearance Customization
     Adaptivity
     Save and Restore Layout
    [Expand]Templates
    [Expand]Export
     Toolbars
   [Expand]Visual Elements
   [Expand]Member Tables
   [Expand]Examples
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Image and Data Browsing
  [Expand]Docking and Popups
  [Expand]Site Navigation and Layout
  [Expand]File Management
  [Expand]Multi-Use Site Controls
  [Expand]Scheduler
  [Expand]HTML Editor
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gauges
  [Expand]Data Editors
  [Expand]Spell Checker
  [Expand]Query Builder
 [Expand]ASP.NET MVC Extensions
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Creating Columns and Binding Them to Data Fields

When ASPxCardView is bound to a data source, you need to create columns and bind them to data fields. There are two ways to add columns and bind them to fields:

  • Automatically create columns for all data fields (default behavior).

    The ASPxCardView control automatically generates columns for all fields in the data source. The order of columns is the same as the order of fields in the data source. The ASPxCardView's ASPxCardView.Columns collection is populated at runtime. This collection is empty at design time.

    This behavior is controlled by the ASPxCardView.AutoGenerateColumns property. This can be useful when the structure of the underlying data source is unknown (e.g., switching between data tables).

  • Create columns and bind them to data fields manually.

    Switch the ASPxCardView.AutoGenerateColumns option off. In this instance, you should manually create all the necessary columns, add them to the ASPxCardView.Columns collection and bind them to data source fields using their CardViewColumn.FieldName property.

Expanded Creating and Binding Columns at Design Time

To access the ASPxCardView's column collection, invoke the Columns edit form.

This form allows you to add, delete, access and customize column settings, and perform other common collection management tasks.

You can also change the column's type. To do this, right-click the required column to invoke the context menu. Select the 'Change To' menu item, and select the required column type.

Note

The column type can only be changed at design time.

Expanded Creating and Binding Columns at Runtime

The example below shows how to create a data column.

If grid columns are generated automatically (the ASPxCardView.AutoGenerateColumns option is enabled), new columns can be added within the grid's DataBound event handler:

Is this topic helpful?​​​​​​​