Recently I had a request to change the column header in a gridvew report.
Click Here to Download Code Sample Now
Although the actual column header "Column A" meant the same as "Column a" I did not wish to maintain separate reports for different clients.
So to handle this issue I made it so that the client could update and XML file and change the column names themselves.
First the XML
<code>
<?xml version="1.0" standalone="yes"?>
<REPORT_LAYOUT>
<COLUMNS>
<COLUMN ColumnName="account_num" HeaderText="Account Number" FontName="Verdana" FontSize="8" FontBold="true" />
<COLUMN ColumnName="company_name" HeaderText="Company Name" FontName="Times" FontSize="10" FontBold="true" />
<COLUMN ColumnName="account_name" HeaderText="Account Name" FontName="arial" FontSize="12" FontBold="true" />
</COLUMNS>
</REPORT_LAYOUT>
</code>
There are 5 attributes in the of each column
1) ColumnName this is the column name that is returned by the database in the DataSet or in our case a DataTable.
2) HeaderText this is the actual text that will be used to replace the Header Row in our GridView.
3) FontName - this show be self explanatory
4) FontSize - this show be self explanatory
5) FontBold - this show be self explanatory
Connection to a Database is not required for this article so as you can see In the Page_Load event I build
A DataTable from code and insert some sample data and then bind it to the GridView ( Gridview1 ).
<code>
protected void Page_Load(object sender, EventArgs e)
{
DataTable objDataTable = new DataTable();
objDataTable.Columns.Add("account_num", typeof(string));
objDataTable.Columns.Add("company_name", typeof(string));
objDataTable.Columns.Add("account_name", typeof(string));
DataRow objDataRow = objDataTable.NewRow();
objDataRow["account_num"] = "00001";
objDataRow["company_name"] = "Acme Golf";
objDataRow["account_name"] = "Sues Account";
objDataTable.Rows.Add(objDataRow);
objDataRow = objDataTable.NewRow();
objDataRow["account_num"] = "00003";
objDataRow["company_name"] = "Cup of Tea";
objDataRow["account_name"] = "Johns Account";
objDataTable.Rows.Add(objDataRow);
objDataRow = objDataTable.NewRow();
objDataRow["account_num"] = "971234";
objDataRow["company_name"] = "Breakfast Delights";
objDataRow["account_name"] = "BOBs Account";
objDataTable.Rows.Add(objDataRow);
GridView1.DataSource = objDataTable;
GridView1.DataBind();
}
</code>
The real beauty of this technique is occurs in the OnRowCreated event for the GridView as shown below.
In this event we detect when the header row is being created, then we take the cell text (which happens to be the column name form the database) and pass it to a function that we created to retrieve the information from the XML file to format our columns the way the client wishes.
<code>
protected void OnRowCreated(object sender, GridViewRowEventArgs e)
{
//We could also have formated each cell with a tablestyle class object as well.
//TableItemStyle tableStyle = new TableItemStyle();
//tableStyle.HorizontalAlign = HorizontalAlign.Center;
//tableStyle.VerticalAlign = VerticalAlign.Middle;
//tableStyle.Font.Name = "Verdana";
//tableStyle.Font.Size = 12;
if (e.Row.RowType == DataControlRowType.Header)
{
foreach (TableCell cell in e.Row.Cells)
{
cell.Font.Name = GetColumnDetailsFromXML(cell.Text, "FontName");
cell.Font.Size = FontUnit.Parse(GetColumnDetailsFromXML(cell.Text, "FontSize"));
cell.Font.Bold = System.Convert.ToBoolean(GetColumnDetailsFromXML(cell.Text, "FontBold"));
cell.Text = GetColumnDetailsFromXML(cell.Text, "HeaderText");
//cell.ApplyStyle(tableStyle); //- We could also have formated each cell with a tablestyle class object as well.
}
}
}
</code>
In the function below we read the XML file CustomizeGridview.xml to retrieve the information for each datarow.
We pass the columnName to the function and use SelectSingleNode and an XPATH query to select the exact row in the XML file that we are looking for.
Example of use for this function is: GetColumnDetailsFromXML("account_num", "FontSize");
<code>
string GetColumnDetailsFromXML(string columnName, string columnAttribute)
{
try
{
// Load the XML file.
string xmlFile = Server.MapPath("CustomizeGridview.xml");
XmlDocument doc = new XmlDocument();
doc.Load(xmlFile);
string myNodeQuery = "REPORT_LAYOUT/COLUMNS/COLUMN[@ColumnName='" + columnName + "']";
XmlNode node = doc.SelectSingleNode(myNodeQuery);
foreach (XmlAttribute attrib in node.Attributes)
{
if (attrib.Name == columnAttribute)
{
return attrib.Value;
}
}
return "";
}
catch (Exception ex)
{
return ex.Message;
}
}
</code>
The above technique can be adabted to most grids on the market not just the GridView.
Click Here to Download Code Sample Now
posted @ Sunday, July 01, 2007 7:08 PM