Command Columns

• Oct 29, 2020
• 2 minutes to read

End-users manipulate the Bootstrap Grid View data using command columns. The Grid View stores command columns together with its data columns within the ASPxGridView.Columns collection.

Commands

A command column is represented by the BootstrapGridViewCommandColumn class. It provides a set of commands that allow end-users to switch the Grid View to the edit mode, and update data, delete rows, etc.

A command column allows multiple commands to be displayed within a cell. A single command is represented by a command item. There are eight command items.

Command	Description	Property
New	Creates a new data row.	ASPxGridViewCommandButtonSettings.NewButton
Edit	Switches ASPxGridView to an edit mode.	ASPxGridViewCommandButtonSettings.EditButton
Delete	Deletes the current data row.	ASPxGridViewCommandButtonSettings.DeleteButton
Select	Selects/deselects data rows.	ASPxGridViewCommandButtonSettings.SelectButton, GridViewCommandColumn.ShowSelectCheckbox
Update	Saves all the changes made to the current data row and switches ASPxGridView to a browse mode.	ASPxGridViewCommandButtonSettings.UpdateButton
Cancel	Discards any changes made to the current data row and switches ASPxGridView to a browse mode.	ASPxGridViewCommandButtonSettings.CancelButton
Clear	Clears the filter expression applied to ASPxGridView.	ASPxGridViewCommandButtonSettings.ClearFilterButton
Recover	Recovers a deleted data row.	ASPxGridViewCommandButtonSettings.RecoverButton

By default, command items are represented by a link. They can also be represented by a button or image. Use the GridViewCommandColumn.ButtonRenderMode property to specify how the command column renders its command items.

To initialize individual command buttons, handle the ASPxGridView.CommandButtonInitialize event.

Custom Buttons

Command columns can also display custom buttons within command cells or filter. You can create your own buttons, and define custom actions for them.

This example shows how to create and initialize a command column with custom command buttons at runtime.

C#

using DevExpress.Web.Bootstrap;

protected void Page_Load(object sender, EventArgs e) {
    if (!IsPostBack) {
        // Creates and initializes a command column.
        BootstrapGridViewCommandColumn commandCol = new BootstrapGridViewCommandColumn("Action");
        commandCol.Name = "Action";
        BootstrapGridView1.Columns.Add(commandCol);
    }
    // Creates a custom command button.
    (BootstrapGridView1.Columns["Action"] 
    as BootstrapGridViewCommandColumn ).CustomButtons.Add(CreateCustomButton());
}

BootstrapGridViewCommandColumnCustomButton CreateCustomButton() {
    BootstrapGridViewCommandColumnCustomButton customBtn = new BootstrapGridViewCommandColumnCustomButton();
    customBtn.ID = "action1";
    customBtn.Text = "Action1";
    customBtn.Visibility = GridViewCustomButtonVisibility.BrowsableRow;
    return customBtn;
}
// Occurs after a command button has been clicked.
protected void BootstrapGridView1_CustomButtonCallback(object sender,
ASPxGridViewCustomButtonCallbackEventArgs e) {
    if (e.ButtonID == "action1") {
        // ...
    }
}

To initialize individual custom command buttons, handle the ASPxGridView.CustomButtonInitialize event.