Hi.
I am trying to modify the back color of the column header in a gridview. We are using MVC/Razor. When we set the back color attribute, the gridview renders with the color only filling about half of the column header area. I'm using the .Styles.Header.BackColor attribute. I've attached an image of what is showing.
Any information about how to manipulate this attribute and others in the column header would be appreciated.
I'm fairly new to DevExpress and MVC in general so please provide a detailed answer if possible.
Best,
John
Hello John,
This property should work fine. Your screenshot makes me think that you are using header templates and a theme. So, to provide you with a precise solution, send us your GridView markup and CSS styles. Your cooperation is highly appreciated.
Hi Marion.
I haven't tried applying a template or a theme so if I did do that it was purely by accident! Here is the code I have in the view:
@using DevExpress.Web.Mvc.UI
@using System.Web.UI.WebControls
@using System
@Html.DevExpress().GridView(
settings =>
{
settings.Name = "SubsidiariesGrid";
settings.CallbackRouteValues = new { Controller = "Subsidiaries", Action = "SubsidiariesGridPartial"};
settings.KeyFieldName = "SubsidiaryID";
settings.Columns.Add("SubsidiaryName");
settings.Columns.Add("AddressLine1");
settings.Columns.Add("AddressLine2");
settings.Columns.Add("City");
settings.Columns.Add("State");
settings.Columns.Add("PostalCode");
settings.Columns.Add("Description");
settings.Columns.Add("PercentOwned");
settings.Columns.Add(column =>
{
column.Caption = "Delete";
column.FieldName = "SubsidiaryDelete";
column.Width = 50;
column.ColumnType = DevExpress.Web.Mvc.MVCxGridViewColumnType.CheckBox;
});
settings.Settings.ShowColumnHeaders = true;
settings.Settings.ShowVerticalScrollBar = true;
settings.Settings.VerticalScrollableHeight = 500;
settings.Width = System.Web.UI.WebControls.Unit.Percentage(100);
settings.SettingsBehavior.AllowSelectSingleRowOnly = true;
settings.SettingsBehavior.AllowSelectByRowClick = true;
settings.SettingsBehavior.AllowFocusedRow = true;
settings.SettingsBehavior.AllowDragDrop = true;
settings.SettingsBehavior.AllowSort = true;
settings.SettingsBehavior.ColumnResizeMode = DevExpress.Web.ASPxGridView.ColumnResizeMode.NextColumn;
settings.Styles.AlternatingRow.BackColor = System.Drawing.Color.AliceBlue;
settings.Styles.Header.BackColor = System.Drawing.Color.LightSkyBlue;
settings.Styles.Header.ForeColor = System.Drawing.Color.Black;
}).Bind(Model).GetHtml()