BootstrapCardViewBuilderBase<T> Class

Serves as the base class that implements the main functionality of Card View.

Namespace: DevExpress.AspNetCore.Bootstrap

Assembly: DevExpress.AspNetCore.Bootstrap.v18.2.dll

Declaration

public abstract class BootstrapCardViewBuilderBase<T> :
        BootstrapControlBuilder<T>,
        IHtmlContent,
        IBootstrapCardViewEx,
        IBootstrapCardView,
        IBootstrapGrid,
        IBootstrapControl
    where T : BootstrapCardViewBuilderBase<T>
Public MustInherit Class BootstrapCardViewBuilderBase(Of T As BootstrapCardViewBuilderBase(Of T))
    Inherits BootstrapControlBuilder(Of T)
    Implements IHtmlContent,
               IBootstrapCardViewEx,
               IBootstrapCardView,
               IBootstrapGrid,
               IBootstrapControl

Type Parameters

Name Description
T

A reference to this instance after the operation is completed.

Remarks

The Card View is a full-featured data presentation control that renders itself using Bootstrap CSS classes. It fully supports data editing and delivers numerous end-user data shaping features, including facilities for end-user data filtering and sorting. Total summaries are also available out-of-the box.

NetCoreCardView

Binding

The Card View control can display data from a database, an array or collection, as well as the public properties of collection elements.

The Card View control has been designed to work with large datasets. When bound to a data source in the database server mode, the Card View only loads small portions of data on demand and all required data processing (such as sorting) is performed on the data server, which significantly reduces the application's response time.

The code sample below demonstrates how to bind the Card View to a dataset using the Bind method.

@model IEnumerable

@(Html.DevExpress()
    .BootstrapCardView<SalesProduct>("cardView")
    .KeyFieldName(m => m.ProductID)
    .Columns(columns => {
        columns.Add(m => m.ProductName);
        columns.Add(m => m.QuantityPerUnit);
        columns.Add()
            .FieldName("UnitPrice");
        columns.Add()
            .FieldName("UnitsOnOrder");
        columns.AddTextColumn()
            .FieldName("Total")
            .UnboundType(UnboundColumnType.Decimal)
            .UnboundExpression("UnitsOnOrder * UnitPrice")
            .PropertiesTextEdit(properties => properties
                .DisplayFormatString("c"));
    })
    .Routes(routes => routes
        .MapRoute(r => r
            .Action("Binding")
            .Controller("CardView")))

    .Bind(Model))

Client-Side API

The BootstrapCardView control provides you with comprehensive client-side functionality implemented using JavaScript code.

  • The control's client-side equivalent is represented by the BootstrapCardView object.
  • On the client side, the client object can be accessed directly by the name specified via the Name property.
  • The available client events can be accessed by using the ClientSideEvents property.

The client-side API is always available for this control.

Online Demos

The Card View control documentation also includes online demos demonstrating the basic control functionality. Follow the ASP.NET Core Card View Demos link to refer to online demos.

See Also