Add columns to ASPxGridView Grid at runtime
The following illustrates the steps necessary to display a DevExpress grid and build the columns at runtime.Create a method to build the columns in the grid.
private void BuildGridColumns()
{
// declare a variable to hold the visible index,
// this value will determine where the column will appear on the grid.
int lVisibleIndex = 0;
// optional, create a command column.
// this will add the 'edit', 'new', 'delete' functionality to the grid.
DevExpress.Web.ASPxGridView.GridViewCommandColumn colCmd = new DevExpress.Web.ASPxGridView.GridViewCommandColumn();
// set the column properties
colCmd.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
colCmd.EditButton.Visible = true; // make sure the Edit button is visible.
colCmd.NewButton.Visible = true; // make sure the New button is visible.
colCmd.DeleteButton.Visible = true; // make sure the Delete button is visible.
// add the column to the grid.
this.grdTest.Columns.Add(colCmd);
// create a label column to display the RowID
DevExpress.Web.ASPxGridView.GridViewDataTextColumn colRowID = new DevExpress.Web.ASPxGridView.GridViewDataTextColumn();
// set the column properties
colRowID.Name = "lRowID"; // set the name of the column
colRowID.Caption = "lRowID"; // set the column caption
colRowID.FieldName = "lRowID"; // set the field source for the column
colRowID.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
colRowID.ReadOnly = true; // set this column to be read only.
colRowID.CellStyle.HorizontalAlign = HorizontalAlign.Center; // set the horizontal alignment.
// add the column to the grid.
this.grdTest.Columns.Add(colRowID);
// create a text column to display the 'sText' field
DevExpress.Web.ASPxGridView.GridViewDataTextColumn colText = new DevExpress.Web.ASPxGridView.GridViewDataTextColumn();
// set the colum properties
colText.Name = "sText"; // set the name of the column
colText.Caption = "sText"; // set the column caption
colText.FieldName = "sText"; // set the field source for the column
colText.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
// add the column to the grid.
this.grdTest.Columns.Add(colText);
// create a spin edit column to display the 'lNumber' field.
DevExpress.Web.ASPxGridView.GridViewDataSpinEditColumn colNumber = new DevExpress.Web.ASPxGridView.GridViewDataSpinEditColumn();
// set the colum properties
colNumber.Name = "lNumber";
colNumber.Caption = "lNumber"; // set the column caption
colNumber.FieldName = "lNumber"; // set the field source for the column
colNumber.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
colNumber.PropertiesSpinEdit.DisplayFormatString = "g"; // set the display format for the value.
// add the column to the grid.
this.grdTest.Columns.Add(colNumber);
// create a date edit column to display the 'dtDate' field.
DevExpress.Web.ASPxGridView.GridViewDataDateColumn dtDate = new DevExpress.Web.ASPxGridView.GridViewDataDateColumn();
// set the colum properties
dtDate.Name = "dtDate";
dtDate.Caption = "dtDate"; // set the column caption
dtDate.FieldName = "dtDate"; // set the field source for the column
dtDate.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
dtDate.PropertiesDateEdit.DisplayFormatString = "M/d/yyyy";
// add the column to the grid.
this.grdTest.Columns.Add(dtDate);
// create a Check column to display the 'bFlag' column
DevExpress.Web.ASPxGridView.GridViewDataCheckColumn bFlag = new DevExpress.Web.ASPxGridView.GridViewDataCheckColumn();
// set the colum properties
bFlag.Name = "bFlag";
bFlag.Caption = "bFlag"; // set the column caption
bFlag.FieldName = "bFlag"; // set the field source for the column
bFlag.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
// add the column to the grid.
this.grdTest.Columns.Add(bFlag);
// create a combo box column to display the 'lNumber2' field.
DevExpress.Web.ASPxGridView.GridViewDataComboBoxColumn cboNumber = new DevExpress.Web.ASPxGridView.GridViewDataComboBoxColumn();
// set the colum properties
cboNumber.Name = "lNumber2";
cboNumber.Caption = "lNumber2"; // set the column caption
cboNumber.FieldName = "lNumber2"; // set the field source for the column
cboNumber.VisibleIndex = lVisibleIndex++; // set the visible index & increment index.
cboNumber.PropertiesComboBox.ValueType = typeof(int); // set the type of the value field.
// add some items to the items collection of the combo box, this will provide the data for the list
cboNumber.PropertiesComboBox.Items.Clear(); // first, clear any existing items
cboNumber.PropertiesComboBox.Items.Add("Zero", 0);
cboNumber.PropertiesComboBox.Items.Add("One", 1);
cboNumber.PropertiesComboBox.Items.Add("Two", 2);
cboNumber.PropertiesComboBox.Items.Add("Three", 3);
cboNumber.PropertiesComboBox.Items.Add("Four", 4);
cboNumber.PropertiesComboBox.Items.Add("Five", 5);
cboNumber.PropertiesComboBox.Items.Add("Six", 6);
cboNumber.PropertiesComboBox.Items.Add("Seven", 7);
// add the column to the grid.
this.grdTest.Columns.Add(cboNumber);
// set the grid so that the focus row is highlighted.
this.grdTest.SettingsBehavior.AllowFocusedRow = true;
this.grdTest.KeyFieldName = "lRowID";
}
In the page load method, call the BuildGridColumns() method.
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
// we're not in a postback
// Build the grid columns, this should not be called if we're in a PostBack
this.BuildGridColumns();
}
// load the grid data
this.LoadGridData();
}
Last modified by Mohit @ 4/7/2025 8:37:58 AM