如何在DevExpress ASPxGridView中进行编辑

Posted 2023-05-06

展示编辑按钮列
<dxwgv:GridViewCommandColumn VisibleIndex="0">
<EditButton Visible="True" Text="修改" />
<DeleteButton Visible="true" Text="删除" />
<NewButton Visible="True" Text="新建" />
<CancelButton Visible="true" Text="取消" />
<UpdateButton Visible="true" Text="保存" />
<ClearFilterButton Visible="true" Text="取消过滤" />
</dxwgv:GridViewCommandColumn>
编辑视图下控件的外观设置»更多DevExpress开发资源与帮助文档
<dx:GridViewDataMemoColumn ... PropertiesMemoEdit-Rows="4" EditFormSettings-ColumnSpan="2" />
或者
<dxwgv:GridViewDataMemoColumn FieldName="Notes" Visible="False">
<EditFormSettings RowSpan="4" ColumnSpan="2" />
</dxwgv:GridViewDataMemoColumn>
示例一： 绑定到IList并实现删除和修改
<dx:ASPxGridView runat="server" ID="gvImages" KeyFieldName="ImageId"
OnRowDeleting= "gvImages_RowDeleting" OnRowUpdating="gvImages_RowUpdating"
>
<SettingsEditing Mode="Inline" />
<SettingsBehavior ConfirmDelete="true" />
<Columns>
<dx:GridViewDataColumn FieldName="ImageId" Caption="ID" Visible="false" />
<dx:GridViewDataImageColumn FieldName="ThumbnailUrl" Caption="缩略图" PropertiesImage-DescriptionUrlField="ImageId" />
<dx:GridViewDataTextColumn FieldName="Description" Caption="说明" />
<dx:GridViewDataTextColumn FieldName="Keywords" Caption="关键字" />
<dx:GridViewCommandColumn Caption="编辑" >
<EditButton Visible="True" Text="修改" />
<DeleteButton Visible="True" Text="删除" />
<CancelButton Text="取消" />
<UpdateButton Text="保存" />
</dx:GridViewCommandColumn>
</Columns>
</dx:ASPxGridView>
// 展示
public void ShowArticleImages()

int articleId = Convert.ToInt32(Request.QueryString[ "articleId"]);
IList <BlogArticleImage> images = BlogArticleImage.ListArticleImages(articleId);
this.gvImages.KeyFieldName = "ImageId";
this.gvImages.DataSource = images;
this.gvImages.DataBind();

// 更新
protected void gvImages_RowUpdating(object sender, DevExpress.Web.Data.ASPxDataUpdatingEventArgs e)

int id = Convert.ToInt32(e.Keys[0]);
string descript = Convert.ToString(e.NewValues[ "Description"]);
string keywords = Convert.ToString(e.NewValues[ "Keywords"]);
BlogArticleImage image = BlogArticleImage.Retrieve(id);
if (image != null)

image.Description = descript;
image.Keywords = keywords;
image.Persist();

e.Cancel = true;
gvImages.CancelEdit();
ShowArticleImages();

// 删除
protected void gvImages_RowDeleting(object sender, DevExpress.Web.Data.ASPxDataDeletingEventArgs e)

int id = Convert.ToInt32(e.Keys[0]);
BlogArticleImage image = BlogArticleImage.Retrieve(id);
if (image != null)

System.IO.File.Delete(Server.MapPath(image.ImageUrl));
System.IO.File.Delete(Server.MapPath(image.ThumbnailUrl));
image.Remove();

e.Cancel = true;
gvImages.CancelEdit();
ShowArticleImages();

示例二： 控件访问权限控制及CRUD操作
<dx:ASPxGridView runat="server" ID="gv" Caption="基础网" KeyFieldName="ID" Width="3000"
OnRowDeleting= "gv_RowDeleting" OnRowUpdating="gv_RowUpdating" OnRowInserting="gv_RowInserting"
OnInitNewRow= "grid_InitNewRow" onhtmlrowcreated="gv_HtmlRowCreated" OnCellEditorInitialize="grid_CellEditorInitialize"
>
<Columns>
<dx:GridViewCommandColumn Caption="编辑" Width="60" >
<EditButton Visible="True" Text="修改" />
<DeleteButton Visible="true" Text="删除" />
<NewButton Visible="True" Text="新建" />
<CancelButton Visible="true" Text="取消" />
<UpdateButton Visible="true" Text="保存" />
</dx:GridViewCommandColumn>
<dx:GridViewDataColumn FieldName="ID" Caption="ID"/>
<dx:GridViewDataColumn FieldName="CREATE_DT" Caption="创建时间"/>
<dx:GridViewDataColumn FieldName="CREATOR" Caption="创建人"/>
<dx:GridViewDataComboBoxColumn FieldName="UNIT" Caption="处理单位" >
<PropertiesComboBox EnableSynchronization="False" EnableIncrementalFiltering="True" DropDownStyle="DropDown" />
</dx:GridViewDataComboBoxColumn>
<dx:GridViewDataColumn FieldName="RESULT" Caption="处理结果" />
<dx:GridViewDataMemoColumn FieldName="ED_CMT" Caption="政企部核对结果" PropertiesMemoEdit-Rows="4" EditFormSettings-ColumnSpan="2" />
</Columns>
</dx:ASPxGridView>
// 普通状态下的命令按钮显隐
protected void gv_HtmlRowCreated(object sender, ASPxGridViewTableRowEventArgs e)

if (!gv.IsEditing && e.RowType == DevExpress.Web.ASPxGridView.GridViewRowType.Data)

bool isAdmin = Common.IsInRoles(new string[] WZWF.DAL.Roles.Admin );
string unit = gv.GetRowValues(e.VisibleIndex, "UNIT").ToString();
bool isAuth = Common.IsInRoles(
unit,
WZWF.DAL.Roles.EnterpriseDepartment,
WZWF.DAL.Roles.MaintainDepartment
);
// 修改按钮
WebControl btnModify = e.Row.Cells[0].Controls[0] as WebControl;
btnModify.Visible = isAuth;
// 新建按钮
WebControl btnAddNew = e.Row.Cells[0].Controls[1] as WebControl;
btnAddNew.Visible = isAdmin;
// 删除按钮
WebControl btnDelete = e.Row.Cells[0].Controls[2] as WebControl;
btnDelete.Visible = isAdmin;


// 编辑状态下的控件访问权限控制
// 管理员：unit, result, md_cmt, ed_cmt
// 政企部：ed_cmt
// 网络维护部：result, md_cmt
protected void grid_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e)

if (gv.IsEditing)

// 受理单位下拉框
if (e.Column.FieldName == "UNIT")

ASPxComboBox combo = e.Editor as ASPxComboBox;
using (DbClean db = new DbClean())

combo.DataSource = db.ListUnits();
combo.TextField = "ROLE";
combo.ValueField = "ROLE";
combo.DataBind();


// 新建状态除了id以外都可以编辑
if (gv.IsNewRowEditing)

e.Editor.ReadOnly = (e.Column.FieldName == "ID");

// 修改状态下根据角色可编辑部分数据
else

e.Editor.ReadOnly = true;
if (e.Column.FieldName == "UNIT")
e.Editor.ReadOnly = !Common.IsInRoles(WZWF.DAL.Roles.Admin);
else if (e.Column.FieldName == "RESULT" || e.Column.FieldName == "MD_CMT")
e.Editor.ReadOnly = !Common.IsInRoles(WZWF.DAL.Roles.Admin, WZWF.DAL.Roles.MaintainDepartment);
else if (e.Column.FieldName == "ED_CMT")
e.Editor.ReadOnly = !Common.IsInRoles(WZWF.DAL.Roles.Admin, WZWF.DAL.Roles.EnterpriseDepartment);


// 可编辑控件设置背景色
e.Editor.BackColor = e.Editor.ReadOnly ? Color.White : Color.LightYellow;

// 删除
protected void gv_RowDeleting(object sender, ASPxDataDeletingEventArgs e)

int id = Convert.ToInt32(e.Keys[0]);
using (DbClean db = new DbClean())
db.DelBasicNet(id);
e.Cancel = true;
gv.CancelEdit();
ShowData(ViewState[ "Unit"].ToString());

// 更新
protected void gv_RowUpdating(object sender, ASPxDataUpdatingEventArgs e)

string unit = Convert.ToString(e.NewValues[ "UNIT"]);
string result = Convert.ToString(e.NewValues[ "RESULT"]);
string edCmt = Convert.ToString(e.NewValues[ "ED_CMT"]);
if (gv.IsEditing)

int id = Convert.ToInt32(e.Keys[0]);
using (DbClean db = new DbClean())
db.ModBasicNet(id, ...);

e.Cancel = true;
gv.CancelEdit();
ShowData(ViewState[ "Unit"].ToString());

// 新增
protected void grid_InitNewRow(object sender, ASPxDataInitNewRowEventArgs e)

e.NewValues[ "CREATOR"] = Page.User.Identity.Name;
e.NewValues[ "CREATE_DT"] = System.DateTime.Now;

protected void gv_RowInserting(object sender, ASPxDataInsertingEventArgs e)

string unit = Convert.ToString(e.NewValues[ "UNIT"]);
string result = Convert.ToString(e.NewValues[ "RESULT"]);
string edCmt = Convert.ToString(e.NewValues[ "ED_CMT"]);
if (gv.IsNewRowEditing)

using (DbClean db = new DbClean())
db.AddBasicNet(.....);

e.Cancel = true;
gv.CancelEdit();
ShowData(ViewState[ "Unit"].ToString());
参考技术A 　　要实现该功能，需在ASPxGridView.Templates.DetailRow 模板中添加一个图表.然后在后台代码中， 为图表添加数据（Init()方法中）.WebChartControl.NamingContainer属性用于获取GridViewDetailRowTemplateContainer 及其KeyValue ，并相应的过滤图表数据。

　　关键代码：[ASPX] [C#]protected voidWebChartControl1_Init(object sender, EventArgs e) WebChartControl chart = (WebChartControl)sender; GridViewDetailRowTemplateContainer container =chart.NamingContainer as GridViewDetailRowTemplateContainer; int categoryId = Convert.ToInt32(container.KeyValue); string categoryName =ASPxGridView1.GetRowValuesByKeyValue(categoryId, newstring[] "CategoryName").ToString(); Series series = newSeries(categoryName, ViewType.Bar); series.ArgumentDataMember = "ProductName"; series.ValueDataMembers.AddRange(new string[] "UnitPrice"); chart.Series.Add(series); ((XYDiagram)chart.Diagram).AxisX.Label.Angle = 90; Session["CategoryID"] =categoryId; chart.DataSource = detailDataSource.Select(DataSourceSelectArguments.Empty); chart.DataBind();

如何给DevExpress中的GridControl添加列

参考技术A 从Visual Studio的DevExpress的工具箱“Data&Analytics”中拖一个GridControl控件到窗体中。

点击GridControl控件上的“Run Designer”按钮，弹出Grid Designer窗体，在该窗体左侧选择“Columns”选项卡，在Columns控制界面中有三个按钮分别可以添加列、插入列和删除列，也可以调整列的上下位置。

选择添加的一个列，在右侧的“Columns properties”选项卡中可以修改列的标题”Caption”和列的名称”Name”，这样就完成了列的添加。

最终添加的列如图所示。 参考技术B 选中GridControl，打开它的Designer的Columns界面。 选择需要进行分组的Column，设置它的GroupIndex属性。