1. You can add Scroll bars to it.
Add a div tag. With its OverFlow property set to ‘auto’.
<div id="DivDatagrid" style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 100px" runat="server">
<asp:Datagrid></asp:Datagrid>
</div>
2. We can make the header locked to mimic a Freeze excel option. Through this the user
can scroll to the farthest (bottom) record and still can have the header.
add a TH tag ad set its Top property as below.
STEP1: TH {
BORDER-RIGHT: silver 1px solid; FONT-WEIGHT: bold; FONT-SIZE: 14px;
Z-INDEX: 10;CURSOR: pointer; COLOR: GrayText; POSITION: relative;
; TOP: expression(document.getElementById("DivDatagrid").scrollTop-2);
BACKGROUND-COLOR: Green; TEXT-ALIGN: left
}
STEP 2: Add the following line in the Style tag . This will render the datagrid with
the scroll bar.
DIV#DivDatagrid
{
OVERFLOW: auto; WIDTH: 420px; SCROLLBAR-BASE-COLOR: #ffeaff; HEIGHT: 200px
}
3. We can lock any other column too. We can use the td.locked style which is defined
like this.
td.locked
{
font-size: 12px;
font-weight: bold;
text-align: left;
background-color: Red;
color: white;
border-right: 1px solid silver;
position:relative;
left: expression(document.getElementById("div-datagrid").scrollLeft-2);
}
In the ItemDataBoundEvent, add the following line.
e.Item.Cells(0).CssClass = "locked”
4. We can do much more in the ItemDataBoundEvent. We can change the color of the cell at runtime. Based
on the values.For e.g. The cell’s forecolor can be changed based on the cell
value. Less than zero will have red color, and greater than zero will have green color.
protected void OnItemDB(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
if ((e.Item.ItemType == ListItemType.Item) ||
(e.Item.ItemType == ListItemType.AlternatingItem))
{
//If value is greater than 0, show green else show red.
if (Convert.ToInt16(e.Item.Cells[6].Text) > 0)
{
e.Item.Cells[6].ForeColor = System.Drawing.Color.Green;
}
else
{
e.Item.Cells[6].ForeColor = System.Drawing.Color.Red;
}
}
}
5. Along with the header that gets created from the datagrid’s datasource, you can create
a top header. You need to tap the PreRender event.
Note: You need to set the Columnspan, so that it expands to the visible column length.
protected void dgPreRender(object sender, System.EventArgs e )
{
DataGridItem dgItem = new DataGridItem (0, 0, ListItemType.Header);
TableCell tbCell = new TableCell();
tbCell.ColumnSpan = 4;// Set it to the colspan
tbCell.Text = "Category Information";
tbCell.Attributes.Add("style", "text-align:center");
dgItem.Cells.Add(tbCell);
DataGrid1.Controls[0].Controls.AddAt(0, dgItem);
}
6. To display an image you can use the Template column and define the image using
the Container.DataItem property
<asp:TemplateColumn>
<ItemTemplate>
<img src='<%#DataBinder.Eval (Container.DataItem, "photocolumn")%>'>
</ItemTemplate>
</asp:TemplateColumn>
7. You can add totals to the footer. At run time. You need to use the ItemDataBound
event for this.
if ((e.Item.ItemType == ListItemType.Item) ||( e.Item.ItemType == ListItemType.AlternatingItem))
{
UPTotal(Double.Parse ( e.Item.Cells[1].Text ));
}
else if (e.Item.ItemType ==ListItemType.Footer )
{
e.Item.Cells [0].Text =" Total ";
e.Item.Cells[1].Text =UnitPrice.ToString ();
}
//use this to compute the total.
protected void UPTotal(double _unitprice)
{
UnitPrice += _unitprice;
}
8. You can export a datagrid to most of the common file formats, using simple code.
//Excel
Response.Clear();
//Add the filename
Response.AddHeader("content-disposition", "attachment;filename=FileName.xls");
Response.Charset = "";
//Remove the cache
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.ContentType = "application/vnd.xls";
System.IO.StringWriter stringWrite = new System.IO.StringWriter();
System.Web.UI.HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);
Datagrid1.RenderControl(htmlWrite);
Response.Write(stringWrite.ToString());
Response.End();
//Word
Response.Clear();
//add the fiename
Response.AddHeader("content-disposition", "attachment;filename=FileName.doc");
Response.Charset = "";
//set no cache
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.ContentType = "application/vnd.word";
System.IO.StringWriter stringWrite = new System.IO.StringWriter();
System.Web.UI.HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);
Datagrid1.RenderControl(htmlWrite);
Response.Write(stringWrite.ToString());
Response.End();
//TextFile.
//use the underlying dataset.
StringBuilder str = new StringBuilder();
for(int i=0;i<=ds.Tables[0].Rows.Count - 1; i++)
{
for(int j=0;j<=ds.Tables[0].Columns.Count - 1; j++)
{
str.Append(ds.Tables[0].Rows[i][j].ToString());
}
str.Append("<BR>");
}
Response.Clear();
//set the filename.
Response.AddHeader("content-disposition", "attachment;filename=FileName.txt");
Response.Charset = "";
//set no cache.
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.ContentType = "application/vnd.text";
System.IO.StringWriter stringWrite = new System.IO.StringWriter();
System.Web.UI.HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);
Response.Write(str.ToString());
Response.End();
9. Dynamically insert a column that keeps the row number.
<asp:templatecolumn headertext="Row Number">
<itemtemplate>
<span><%# Container.ItemIndex+1 %></span>
</itemtemplate>
</asp:templatecolumn>