Skip to main content

Unbound Columns

  • 3 minutes to read

This topic describes the main concepts of using unbound columns within the CardView extension.

Unbound Columns Overview

CardView supports both bound and unbound columns. Bound columns obtain their data from a data source. Unbound columns are not bound to any field in a data source. These columns can be populated manually by using the CardViewSettings.CustomUnboundColumnData delegate or by specifying an expression via the CardViewColumn.UnboundExpression used to evaluate values for this field. The Expressions section describes the syntax for creating expressions.

There is no difference between working with bound and unbound columns. You can sort, display summaries and filter unbound columns in the same manner as bound columns.

An unbound column has the following requirements.

  • Its CardViewColumn.FieldName property must be set to a unique value and not refer to any field in the CardView‘s data source.
  • The column’s CardViewColumn.UnboundType property must be set to an appropriate value based on the type of data the column is supposed to display (Boolean, DateTime, Decimal, Integer, String, Object). It should not be set to UnboundColumnType.Bound.

Providing Data for Unbound Columns

ASP.NET MVC CardView provides two approaches to generate data for unbound columns.

  • Using an Unbound Expression

    To provide unbound columns with data using unbound expressions, compose the expression based on a specific syntax, and assign this expression to the CardViewColumn.UnboundExpression (via MVCxCardViewColumn.UnboundExpression) property.

    The code sample below demonstrates how to add an unbound column that retrieves its data using an unbound expression.

    Partial View code:

    @Html.DevExpress().CardView(settings => {
        settings.Name = "CardView";
        settings.CallbackRouteValues = new { Controller = "Home", Action = "CardViewPartial" };
        // ...
        // Add columns bound to model fields.
        settings.Columns.Add("FirstName");
        settings.Columns.Add("LastName");
        // Add an unbound column.
        settings.Columns.Add(column => {
            // "FieldName" contains a unique value that does not refer to any field in the CardView's data model. 
            column.FieldName = "FullName";
            // The column contains string values.
            column.UnboundType = DevExpress.Data.UnboundColumnType.String;
            // An unbound expression.
            column.UnboundExpression = "[FirstName]+' '+[LastName]";
        });
    }).Bind(Model).GetHtml()
    
  • Using a Delegate Method

    To provide unbound columns with data using a delegate method, assign this delegate method to the CardViewSettings.CustomUnboundColumnData property. The delegate method assigned to this property will be called for unbound columns only.

    The code sample below demonstrates how to add an unbound column that retrieves data using a delegate method.

    Partial View code:

    @Html.DevExpress().CardView(settings => {
        settings.Name = "CardView";
        settings.CallbackRouteValues = new { Controller = "Home", Action = "CardViewPartial" };
        // ...
        // Add columns bound to model fields.
        settings.Columns.Add("FirstName");
        settings.Columns.Add("LastName");
        settings.Columns.Add(column => {
            // "FieldName" contains a unique value that does not refer to any field in the CardView's data model. 
            column.FieldName = "FullName";
            // The column contains string values.
            column.UnboundType = DevExpress.Data.UnboundColumnType.String;
        });
        // A delegate method that allows you to generate data for an unbound column.
        settings.CustomUnboundColumnData = (s, e) => {
            if (e.Column.FieldName == "FullName") {
                string firstName = (e.GetListSourceFieldValue("FirstName")).ToString();
                string lastName = (e.GetListSourceFieldValue("LastName")).ToString();
                e.Value = firstName + " " + lastName;
            };
        };
    }).Bind(Model).GetHtml()
    

Note

When the CardView extension is bound to a data source in Database Server Mode, you can only enable sorting, filtering and summary calculation for unbound columns that are populated with unbound expressions.

See Also