Back to Devexpress

CardViewColumn.DataItemTemplate Property

aspnet-devexpress-dot-web-dot-cardviewcolumn-a72c89ae.md

latest4.5 KB
Original Source

CardViewColumn.DataItemTemplate Property

Gets or sets a template for displaying data cells within the current column.

Namespace : DevExpress.Web

Assembly : DevExpress.Web.v25.2.dll

NuGet Package : DevExpress.Web

Declaration

csharp
[DefaultValue(null)]
public virtual ITemplate DataItemTemplate { get; set; }
vb
<DefaultValue(Nothing)>
Public Overridable Property DataItemTemplate As ITemplate

Property Value

TypeDefaultDescription
ITemplatenull

An object that implements the ITemplate interface.

|

Remarks

To provide a common template for displaying data cells within the ASPxCardView, use the CardViewTemplates.DataItem property.

Note

Once a template defined via the DataItemTemplate property is created within a control, it is instantiated within a container object of the CardViewDataItemTemplateContainer type. This container object exposes a set of specific properties to which the template’s child controls can be bound.

Example

Search results contained in templates are not highlighted by default, but you can highlight them manually. The following example wraps the search results in a <span> tag with the dxcvHL class. Note that this is a basic example that illustrates how to process simple requests. If you create composite criteria, it is necessary to perform additional operations to parse the search text.

aspx
<dx:ASPxCardView ID="ASPxCardView1" runat="server" AutoGenerateColumns="False" DataSourceID="ads" KeyFieldName="CategoryID">
    <SettingsSearchPanel Visible="True" />
    <Columns>
        <dx:CardViewTextColumn FieldName="CategoryID" ReadOnly="True" Visible="False" />
        <dx:CardViewTextColumn FieldName="CategoryName" />
        <dx:CardViewTextColumn FieldName="Description" >
            <DataItemTemplate>
                <dx:ASPxLabel ID="label1" runat="server" Text='<%# Eval("Description") %>' 
                              EncodeHtml="false" OnDataBound="label1_DataBound"/>
                <dx:ASPxImage ID="ASPxImage2" runat="server" ShowLoadingImage="true" 
                              ImageUrl='<%# string.Format("~/Images/{0}.jpg", Eval("CategoryID")) %>' />
            </DataItemTemplate>
        </dx:CardViewTextColumn>
    </Columns>
</dx:ASPxCardView>
csharp
protected void label1_DataBound(object sender, EventArgs e) {
    ASPxLabel label = sender as ASPxLabel;
    label.Text = HighlightSearchText(label.Text, ASPxCardView1.SearchPanelFilter);
}
public static string HighlightSearchText(string source, string searchText) {
    if (string.IsNullOrWhiteSpace(searchText))
        return source;
    var regex = new Regex(Regex.Escape(searchText), RegexOptions.IgnoreCase);
    if (regex.IsMatch(source))
        return string.Format("<span>{0}</span>", regex.Replace(source, "<span class='dxcvHL'>$0</span>"));
    return source;
}
vb
Protected Sub label1_DataBound(ByVal sender As Object, ByVal e As EventArgs)
    Dim label As ASPxLabel = TryCast(sender, ASPxLabel)
    label.Text = HighlightSearchText(label.Text, ASPxCardView1.SearchPanelFilter)
End Sub

Public Shared Function HighlightSearchText(ByVal source As String, ByVal searchText As String) As String
    If String.IsNullOrWhiteSpace(searchText) Then
        Return source
    End If
    Dim regex = New Regex(System.Text.RegularExpressions.Regex.Escape(searchText), RegexOptions.IgnoreCase)
    If regex.IsMatch(source) Then
        Return String.Format("<span>{0}</span>", regex.Replace(source, "<span class='dxcvHL'>$0</span>"))
    End If
    Return source
End Function

See Also

DataItem

Card View

CardViewColumn Class

CardViewColumn Members

DevExpress.Web Namespace