How to Use the asp.net GridView Control

Foreground. aspx

Copy codeThe Code is as follows: <asp: Label ID = "tplb" runat = "server" Text = "total page number:"> </asp: Label>
<Asp: Label ID = "lblPageCount" runat = "server" Text = ""> </asp: Label>
<Asp: Label ID = "curLabel" runat = "server" Text = "Current page:"> </asp: Label>
<Asp: Label ID = "lblPage" Text = "1" runat = "server"> </asp: Label>
<Asp: LinkButton ID = "lblFirstButton" runat = "server" OnClick = "lblFirstButton_Click" >|< </asp: LinkButton>
<Asp: LinkButton ID = "lblPreButton" runat = "server" OnClick = "lblPreButton_Click"> </asp: LinkButton>
<Asp: LinkButton ID = "lblNextButton" runat = "server" OnClick = "lblNextButton_Click" >></asp: LinkButton>
<Asp: LinkButton ID = "lblLastButton" runat = "server" OnClick = "lblLastButton_Click" >|</asp: LinkButton>
<Asp: DropDownList ID = "ddlPage" runat = "server" Width = "40px" AutoPostBack = "True"
OnSelectedIndexChanged = "ddlPage_SelectedIndexChanged">
<Asp: ListItem> 10 </asp: ListItem>
<Asp: ListItem> 15 </asp: ListItem>
<Asp: ListItem> 20 </asp: ListItem>
<Asp: ListItem> 30 </asp: ListItem>
</Asp: DropDownList>
<Asp: Label ID = "PageSizeLabel" runat = "server" Text = "bar/page"> </asp: Label>

BackgroundCopy codeThe Code is as follows: # region Paging
Protected void BindFollowExamInfoGridView (int PersonID)
{
Int currentpage = Convert. ToInt32 (lblPage. Text );
DataTable dt = new DataTable ();
Dt = feibf. GetByPersonIDFollowExamInfo (PersonID); // query the follow-up information record of the specified person
If (dt. Rows. Count> 0)
{
FollowExamInfoGridView. DataSource = dt;
FollowExamInfoGridView. DataBind ();
PagedDataSource ps = new PagedDataSource ();
Ps. DataSource = dt. DefaultView;
Ps. AllowPaging = true;
Ps. PageSize = Convert. ToInt32 (ddlPage. SelectedValue );
LblPageCount. Text = ps. PageCount. ToString ();
This. lblPreButton. Enabled = true;
This. lblNextButton. Enabled = true;
Ps. CurrentPageIndex = currentpage-1;
If (currentpage = 1)
{
This. lblPreButton. Enabled = false;
This. lblFirstButton. Enabled = false;
}
Else
{
This. lblPreButton. Enabled = true;
This. lblFirstButton. Enabled = true;
}
If (currentpage = ps. PageCount)
{
This. lblNextButton. Enabled = false;
This. lblLastButton. Enabled = false;
}
Else
{
This. lblNextButton. Enabled = true;
This. lblLastButton. Enabled = true;
}
FollowExamInfoGridView. DataSource = ps;
FollowExamInfoGridView. DataBind ();
}
　　　　
}
Protected void lblPreButton_Click (object sender, EventArgs e)
{
This. lblPage. Text = Convert. ToString (Convert. ToUInt32 (lblPage. Text)-1 );
BindFollowExamInfoGridView (Convert. ToInt32 (Request. QueryString ["PersonID"]);
}
Protected void lblNextButton_Click (object sender, EventArgs e)
{
This. lblPage. Text = Convert. ToString (Convert. ToUInt32 (lblPage. Text) + 1 );
BindFollowExamInfoGridView (Convert. ToInt32 (Request. QueryString ["PersonID"]);
}
Protected void lblFirstButton_Click (object sender, EventArgs e)
{
This. lblPage. Text = "1 ";
BindFollowExamInfoGridView (Convert. ToInt32 (Request. QueryString ["PersonID"]);
}
Protected void lblLastButton_Click (object sender, EventArgs e)
{
This. lblPage. Text = lblPageCount. Text;
BindFollowExamInfoGridView (Convert. ToInt32 (Request. QueryString ["PersonID"]);
}
Protected void ddlPage_SelectedIndexChanged (object sender, EventArgs e)
{
LblPage. Text = "1 ";
BindFollowExamInfoGridView (Convert. ToInt32 (Request. QueryString ["PersonID"]);
}
# Endregion

Sort
Allowsort = "true"
SortExpression = "ID"
DataView dv = SortBindGrid (dt );
# Region sorting
Protected void FollowExamInfoGridView_Sorting (object sender, GridViewSortEventArgs e)
{
ViewState ["sortexpression"] = e. SortExpression;
If (ViewState ["sortdirection"] = null)
{
ViewState ["sortdirection"] = "asc ";
}
Else
{
If (ViewState ["sortdirection"]. ToString () = "asc ")
{
ViewState ["sortdirection"] = "desc ";
}
Else
{
ViewState ["sortdirection"] = "asc ";
}
}
　　　
BindFollowExamInfoGridView (Convert. ToInt32 (HiddenPersonID. Value ));
}
Public DataView SortBindGrid (DataTable table)
{
If (table! = Null)
{
DataView dv = table. DefaultView;
If (ViewState ["sortexpression"]! = Null & ViewState ["sortdirection"]! = Null)
{
Dv. Sort = ViewState ["sortexpression"]. ToString () + "" + ViewState ["sortdirection"]. ToString ();
}
Return dv;
}
Else
{
Return null;
}
}
# Endregion

======= Built-in Paging
# Region built-in Paging

Protected void FollowExamInfoGridView_PageIndexChanging (object sender, GridViewPageEventArgs e)
{
FollowExamInfoGridView. PageIndex = e. NewPageIndex;
BindFollowExamInfoGridView (Convert. ToInt32 (HiddenPersonID. Value ));
}
# Endregion

Implementation of the selected Grid ViewCopy codeThe Code is as follows: # region implements the selected line
<SelectedRowStyle BackColor = "AliceBlue" ForeColor = "Gray"/>
<Asp: CommandField ShowSelectButton = "True"/>
If (e. Row. RowType = DataControlRowType. DataRow)
{
E. Row. Attributes. Add ("onclick", "this. cells [0]. childNodes [0]. click ()");
}
Protected void GridViewRegiment_SelectedIndexChanged (object sender, EventArgs e)
{
GridViewRow row = GridViewRegiment. SelectedRow;
Int RegimentID = Convert. ToInt32 (row. Cells [1]. Text );
Response. Redirect ("UpdateRegimentation. aspx? RegimentID = "+ RegimentID );
}
# Endregion

Display color and deleteCopy codeThe Code is as follows: protected void GridView1_RowDataBound (object sender, GridViewRowEventArgs e)
{
// Int I;
// For (I = 0; I <GridViewRegiment. Rows. Count; I ++)
//{
If (e. Row. RowType = DataControlRowType. DataRow)
{
// When an edit Column exists, avoid errors and add RowState to judge
If (e. Row. RowState = DataControlRowState. Normal | e. Row. RowState = DataControlRowState. Alternate)
{
(ImageButton) e. row. cells [2]. findControl ("IBtndelete ")). attributes. add ("onclick", "javascript: return confirm ('Are you sure you want to delete:" "+ e. row. cells [0]. text +? ')");
}
E. Row. Attributes. Add ("onmouseover", "this. style. backgroundColor = '# 00A9FF '");
E. Row. Attributes. Add ("onmouseout", "this. style. backgroundColor = '# E6F5FA '");
}
//}
}

Processing of blank GridView
1. No blank record is displayed. EmptyDataText = "no record"
2. Display empty records in the headerCopy codeThe Code is as follows: DataTable dt = new DataTable ();
Dt = feibf. GetByPersonIDFollowExamInfo (PersonID); // query the follow-up information record of the specified person
DataView dv = SortBindGrid (dt );
If (dt. Rows. Count> 0)
{
FollowExamInfoGridView. DataSource = dv;
FollowExamInfoGridView. DataBind ();
}
Else
{
// Add a new row to display the header
Dt. Rows. Add (dt. NewRow ());
FollowExamInfoGridView. DataSource = dt;
FollowExamInfoGridView. DataBind ();
// Process new rows
Int columnCount = FollowExamInfoGridView. Rows [0]. Cells. Count;
// Clear all cells of the empty row
FollowExamInfoGridView. Rows [0]. Cells. Clear ();
// Create a Cell Object
FollowExamInfoGridView. Rows [0]. Cells. Add (new TableCell ());
// Merge Cells
FollowExamInfoGridView. Rows [0]. Cells [0]. ColumnSpan = columnCount;
// Set the cell prompt content
FollowExamInfoGridView. Rows [0]. Cells [0]. Style. Value = "text-align: center ";
FollowExamInfoGridView. Rows [0]. Cells [0]. Text = "no follow-up information for this person ";
}

Export of GridView
EnableEventValidation = "false"Copy codeThe Code is as follows: # region Export
Public override void VerifyRenderingInServerForm (Control control Control)
{
}
Protected void BtnPrint_Click (object sender, EventArgs e)
{
Response. Clear ();
Response. Buffer = true;
Response. Charset = "GB2312 ";
Response. AppendHeader ("Content-Disposition", "attachment?filename=filename.xls ");
// If it is set to GetEncoding ("GB2312"), the exported file will contain garbled characters !!!
Response. ContentEncoding = System. Text. Encoding. UTF7;
Response. ContentType = "application/ms-excel"; // set the output file type to an excel file.
System. IO. StringWriter oStringWriter = new System. IO. StringWriter ();
System. Web. UI. HtmlTextWriter oHtmlTextWriter = new System. Web. UI. HtmlTextWriter (oStringWriter );
This. AfficheGV. RenderControl (oHtmlTextWriter );
Response. Output. Write (oStringWriter. ToString ());
Response. Flush ();
Response. End ();
}
# Endregion

Display ToolTip GridView details
Front-end
<Script type = "text/javascript">
Function Tooltip (cella, cellb)
{
Document. getElementById ("dc"). innerText = "details:" + cellb;
Document. getElementById ("id"). innerText = "ID:" + cella;
X = event. clientX + document. body. scrollLeft;
Y = event. clientY + document. body. scrollTop + 20;
ToolTipLayer. style. display = "inline ";
ToolTipLayer. style. left = x;
ToolTipLayer. style. top = y;
}
</Script>
<Div id = "toolTipLayer" style = "position: absolute; display: none;
Background-color: Aqua; border-color: Blue; border-style: solid;
Border-color: Blue; border-width: 1px; ">
<Table>
<Tr> <td> Affiche </td> </tr>
<Tr> <td id = "dc"> </td> </tr>
<Tr> <td id = "id"> </td> </tr>
</Table>
</Div>

BackgroundCopy codeThe Code is as follows: protected void AfficheGV_RowDataBound (object sender, GridViewRowEventArgs e)
{
If (e. Row. RowType = DataControlRowType. DataRow)
{
If (e. Row. RowState = DataControlRowState. Normal | e. Row. RowState = DataControlRowState. Alternate)
{
1 e. row. attributes. add ("onmouseover", "Tooltip ('" + e. row. cells [0]. text. toString () + "','" + e. row. cells [1]. text. toString () + "')");
2 e. Row. Attributes. Add ("onmouseover", "javascript: Tooltip ('E. Row. Cells [0]. text ');");
3 e. Row. Attributes. Add ("onmouseover", "Tooltip ('E. Row. Cells [0]. text ')");
}}
}

# Region built-in editing
Protected void GVAffiche_RowEditing (object sender, GridViewEditEventArgs e)
{
GVAffiche. EditIndex = e. NewEditIndex;
BindGVAffiche ();
}
Protected void GVAffiche_RowDeleting (object sender, GridViewDeleteEventArgs e)
{
GVAffiche. EditIndex =-1;
MyAffiche. DelAfficeBF (Convert. ToInt32 (GVAffiche. DataKeys [e. RowIndex]. Value. ToString ()));
BindGVAffiche ();
}
Protected void GVAffiche_RowUpdating (object sender, GridViewUpdateEventArgs e)
{
Int id = Convert. toInt32 (TextBox) (GVAffiche. rows [e. rowIndex]. cells [0]. controls [0]). text. toString (). trim ());
String dc = (TextBox) (GVAffiche. Rows [e. RowIndex]. Cells [1]. Controls [0]). Text. ToString (). Trim ();
MyAffiche. UpdateAfficheBf (id, dc );
GVAffiche. EditIndex =-1;
BindGVAffiche ();
}
Protected void GVAffiche_RowCancelingEdit (object sender, GridViewCancelEditEventArgs e)
{
GVAffiche. EditIndex =-1;
BindGVAffiche ();
}
# Endregion

# Region style Control
Protected void GVAffiche_RowDataBound (object sender, GridViewRowEventArgs e)
{
// First determine whether it is a data row
If (e. Row. RowType = DataControlRowType. DataRow)
{
// When an edit Column exists, avoid errors and add RowState to judge
If (e. Row. RowState = DataControlRowState. Normal | e. Row. RowState = DataControlRowState. Alternate)
{
(Button) e. row. cells [7]. findControl ("btnDel ")). attributes. add ("onclick", "javascript: return confirm ('Are you sure you want to delete:" "+ e. row. cells [1]. text + ""')");
// Change the background color when the mouse stays
E. Row. Attributes. Add ("onmouseover", "color = this. style. backgroundColor; this. style. backgroundColor = '# 00A9FF '");
// Restore the background color when you move the mouse away.
E. Row. Attributes. Add ("onmouseout", "this. style. backgroundColor = color ");
GVAffiche. Attributes. Add ("style", "word-break: keep-all; word-wrap: normal ");
// GVAffiche. Attributes. Add ("style", "word-break: break-all; word-wrap: break-word ");
If (e. Row. Cells [1]. Text = "444 ")
{
E. Row. Cells [1]. BackColor = System. Drawing. Color. Red;
}
}
}
}
# Endregion

The above is the basic usage of the GridView control, and I hope it will be useful to everyone.