A newer version of this page is available. Switch to the current version.

CardViewSettings.SetDataItemTemplateContent(Action<CardViewDataItemTemplateContainer>) Method

Allows setting a template for displaying data cells.

Namespace: DevExpress.Web.Mvc

Assembly: DevExpress.Web.Mvc5.v18.2.dll

Declaration

public void SetDataItemTemplateContent(
    Action<CardViewDataItemTemplateContainer> contentMethod
)
Public Sub SetDataItemTemplateContent(
    contentMethod As Action(Of CardViewDataItemTemplateContainer)
)

Parameters

Name Type Description
contentMethod Action<CardViewDataItemTemplateContainer>

A method to which a template content rendering is delegated.

Remarks

NOTE

Once a template defined using the SetDataItemTemplateContent method is created, it is instantiated within a container object of the CardViewDataItemTemplateContainer type. This container object exposes a set of members which can be useful when designing a template.

The code sample below demonstrates how to define a template common to all the CardView data cells.


@Html.DevExpress().CardView(settings =>
{
    settings.Name = "CardView";
    ...
    // Setting a template to render all the data cells within a CardView
    settings.SetDataItemTemplateContent(cell => {
        ViewContext.Writer.Write("<span style=\"color:red\">" + cell.Text + "</span>");
    });

    settings.Columns.Add("ShipName");
    settings.Columns.Add("ShipCity");
    settings.Columns.Add("ShipPostalCode");
    settings.Columns.Add("ShipCountry");
    ...
}).Bind(Model).GetHtml()

The image below illustrates the result.

CardView_Template_RedText

NOTE

Batch Edit Mode Limitations

When adding new cards in Batch Editing mode, only a light (client HTML hierarchy) copy of the server MVC extensions in the template defined via the CardViewSettings.SetDataItemTemplateContent(Action`1) method is created. Since there is no callback to the server, MVC Extensions cannot be initialized completely according to the logic defined on the server. In other words, the server-side code that adjusts the extension settings is not triggered. Therefore, the resulting UI might not operate as expected.

See Also