How to: Specify the CommandButtons and Custom CommandButtons Properties

• Dec 17, 2020
• 2 minutes to read

The following example handles the CommandButtonInitialize and CustomButtonInitialize events to specify the CommandButtons and CustomCommandButtons properties. The DataRow’s VisibleIndex property and criteria (set based on field values) are used to determine button visibility.

Default.aspx (C#)

<dx:ASPxCardView ID="ASPxCardView1" runat="server" DataSourceID="AccessDataSource1"         
    OnCustomButtonInitialize="ASPxCardView1_CustomButtonInitialize" 
    OnCommandButtonInitialize="ASPxCardView1_CommandButtonInitialize" 
    KeyFieldName="ProductID" AutoGenerateColumns="False">
    <ClientSideEvents CustomButtonClick="function(s, e) {alert('keyValue = ' + s.GetCardKey(e.visibleIndex));}" />
    <SettingsBehavior AllowFocusedCard="true" />
    <Columns>
        <dx:CardViewTextColumn FieldName="ProductName" />
        <dx:CardViewTextColumn FieldName="UnitPrice" />
        <dx:CardViewTextColumn FieldName="ProductID" ReadOnly="True">
    </Columns>
    <CardLayoutProperties>
        <Items>
            <dx:CardViewCommandLayoutItem HorizontalAlign="Right" 
                                          ShowDeleteButton="True" 
                                          ShowEditButton="True" />
            <dx:CardViewColumnLayoutItem ColumnName="ProductID" />
            <dx:CardViewColumnLayoutItem ColumnName="Product Name" />
            <dx:CardViewColumnLayoutItem ColumnName="UnitPrice" />
        </Items>
    </CardLayoutProperties>
</dx:ASPxCardView>  

Default.aspx.cs

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 = "CustomBtn";
    customBtn.Text = "Custom button";
    return customBtn;
}
protected void ASPxCardView1_CommandButtonInitialize(object sender, ASPxCardViewCommandButtonEventArgs e) {
    if (e.VisibleIndex == -1) return;
    switch (e.ButtonType) {
        case CardViewCommandButtonType.Edit:
            e.Visible = EditButtonVisibleCriteria((ASPxCardView)sender, e.VisibleIndex);
            break;
        case CardViewCommandButtonType.Delete:
            e.Visible = DeleteButtonVisibleCriteria((ASPxCardView)sender, e.VisibleIndex);
            break;
    }
}
private bool EditButtonVisibleCriteria(ASPxCardView grid, int visibleIndex) {
    object card = grid.GetDataRow(visibleIndex);
    return ((DataRow)card)["ProductName"].ToString().Contains("a");
}
private bool DeleteButtonVisibleCriteria(ASPxCardView grid, int visibleIndex) {
    object card = grid.GetDataRow(visibleIndex);
    return ((DataRow)card)["ProductName"].ToString().Contains("b");
}
protected void ASPxCardView1_CustomButtonInitialize(object sender, ASPxCardViewCustomCommandButtonEventArgs e) {
    if (e.VisibleIndex == -1) return;
    if (e.ButtonID == "CustomBtn" && e.VisibleIndex % 2 != 0)
        e.Visible = DefaultBoolean.False;
}

Default.aspx.vb

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 = "CustomBtn"
    customBtn.Text = "Custom button"
    Return customBtn
End Function
Protected Sub ASPxCardView1_CommandButtonInitialize(ByVal sender As Object, ByVal e As ASPxCardViewCommandButtonEventArgs)
    If e.VisibleIndex = -1 Then
        Return
    End If
    Select Case e.ButtonType
        Case CardViewCommandButtonType.Edit
            e.Visible = EditButtonVisibleCriteria(DirectCast(sender, ASPxCardView), e.VisibleIndex)
        Case CardViewCommandButtonType.Delete
            e.Visible = DeleteButtonVisibleCriteria(DirectCast(sender, ASPxCardView), e.VisibleIndex)
    End Select
End Sub
Private Function EditButtonVisibleCriteria(ByVal grid As ASPxCardView, ByVal visibleIndex As Integer) As Boolean
    Dim card As Object = grid.GetDataRow(visibleIndex)
    Return DirectCast(card, DataRow)("ProductName").ToString().Contains("a")
End Function
Private Function DeleteButtonVisibleCriteria(ByVal grid As ASPxCardView, ByVal visibleIndex As Integer) As Boolean
    Dim card As Object = grid.GetDataRow(visibleIndex)
    Return DirectCast(card, DataRow)("ProductName").ToString().Contains("b")
End Function
Protected Sub ASPxCardView1_CustomButtonInitialize(ByVal sender As Object, ByVal e As ASPxCardViewCustomCommandButtonEventArgs)
    If e.VisibleIndex = -1 Then
        Return
    End If
    If e.ButtonID = "CustomBtn" AndAlso e.VisibleIndex Mod 2 <> 0 Then
        e.Visible = DefaultBoolean.False
    End If
End Sub