CardViewCommandLayoutItem.CustomButtons Property
Gets the collection of custom buttons.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v19.1.dll
Declaration
public CardViewCustomCommandButtonCollection CustomButtons { get; }
Public ReadOnly Property CustomButtons As CardViewCustomCommandButtonCollection
Property Value
The command layout item can display custom buttons. You can create your own buttons and define custom actions for them by handling the ASPxCardView.CustomButtonCallback event.
Example
This example shows how to create and customize a custom command button. The custom “Filter” button CardViewCustomCommandButton is added to the CustomButtons
collection. To define an action of the custom “Filter” button, the CustomButtonCallback event is handled.
<dx:ASPxCardView ID="ASPxCardView1" runat="server" DataSourceID="AccessDataSource1" KeyFieldName="CustomerID" AutoGenerateColumns="False" OnCustomButtonCallback="ASPxCardView1_CustomButtonCallback">
<SettingsBehavior AllowFocusedCard="true" />
<Columns>
<dx:CardViewTextColumn FieldName="CompanyName" VisibleIndex="1">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="ContactName" VisibleIndex="2">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="City" VisibleIndex="5">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Region" VisibleIndex="6">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Country" VisibleIndex="8">
</dx:CardViewTextColumn>
</Columns>
<CardLayoutProperties>
<Items>
<dx:CardViewCommandLayoutItem HorizontalAlign="Right">
</dx:CardViewCommandLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Company Name">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Contact Name">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="City">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Region">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Country">
</dx:CardViewColumnLayoutItem>
<dx:EditModeCommandLayoutItem HorizontalAlign="Right">
</dx:EditModeCommandLayoutItem>
</Items>
</CardLayoutProperties>
</dx:ASPxCardView>
<br />
<asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/nwind.mdb" SelectCommand="SELECT * FROM [Customers]" />
using DevExpress.Web;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
(ASPxCardView1.CardLayoutProperties.Items[0] as CardViewCommandLayoutItem).CustomButtons.Add(CreateCustomButton());
}
}
CardViewCustomCommandButton CreateCustomButton()
{
CardViewCustomCommandButton customBtn = new CardViewCustomCommandButton();
customBtn.ID = "FilterBtn";
customBtn.Text = "Filter";
return customBtn;
}
protected void ASPxCardView1_CustomButtonCallback(object sender, ASPxCardViewCustomButtonCallbackEventArgs e)
{
if (e.ButtonID == "FilterBtn")
{
ASPxCardView cardview = sender as ASPxCardView;
cardview.FilterExpression = "[Country] like '%Germany%'";
}
}
}
Imports DevExpress.Web
Partial Public Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
If Not IsPostBack Then
TryCast(ASPxCardView1.CardLayoutProperties.Items(0), CardViewCommandLayoutItem).CustomButtons.Add(CreateCustomButton())
End If
End Sub
Private Function CreateCustomButton() As CardViewCustomCommandButton
Dim customBtn As New CardViewCustomCommandButton()
customBtn.ID = "FilterBtn"
customBtn.Text = "Filter"
Return customBtn
End Function
Protected Sub ASPxCardView1_CustomButtonCallback(ByVal sender As Object, ByVal e As ASPxCardViewCustomButtonCallbackEventArgs)
If e.ButtonID = "FilterBtn" Then
Dim cardview As ASPxCardView = TryCast(sender, ASPxCardView)
cardview.FilterExpression = "[Country] like '%Germany%'"
End If
End Sub
End Class
<dx:ASPxCardView ID="ASPxCardView1" runat="server" DataSourceID="AccessDataSource1" KeyFieldName="CustomerID" AutoGenerateColumns="False" OnCustomButtonCallback="ASPxCardView1_CustomButtonCallback">
<SettingsBehavior AllowFocusedCard="true" />
<Columns>
<dx:CardViewTextColumn FieldName="CompanyName" VisibleIndex="1">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="ContactName" VisibleIndex="2">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="City" VisibleIndex="5">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Region" VisibleIndex="6">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Country" VisibleIndex="8">
</dx:CardViewTextColumn>
</Columns>
<CardLayoutProperties>
<Items>
<dx:CardViewCommandLayoutItem HorizontalAlign="Right">
</dx:CardViewCommandLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Company Name">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Contact Name">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="City">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Region">
</dx:CardViewColumnLayoutItem>
<dx:CardViewColumnLayoutItem ColumnName="Country">
</dx:CardViewColumnLayoutItem>
<dx:EditModeCommandLayoutItem HorizontalAlign="Right">
</dx:EditModeCommandLayoutItem>
</Items>
</CardLayoutProperties>
</dx:ASPxCardView>
<asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/nwind.mdb" SelectCommand="SELECT * FROM [Customers]" />
See Also