Asp. Application techniques of DataGrid control in net

Last Update:2017-02-28 Source: Internet

Author: User

Tags implement modify visual studio

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Asp.net|datagrid|datagrid Control | tips one. Overview:

In the process of developing a Web application using ASP.net, the DataGrid is a very important control, and almost any data-related performance needs to be used for that control. So mastering the application skills of the DataGrid control is essential to every web developer.

The DataGrid control can dramatically simplify the development of Web applications by displaying data from a data source in a tabular format and providing some powerful built-in features such as paging, sorting, and filtering. At the same time, developers can use a variety of data binding columns to customize how the DataGrid control displays data, which greatly enhances the functionality of the DataGrid control. This article I will introduce to you how to use the TemplateColumn, EditCommandColumn, HyperLinkColumn, ButtonColumn and BoundColumn, and so on, customize how the DataGrid control displays data.

　　 two. Application of BoundColumn data columns:

Generally, when we use the DataGrid control to develop a data-driven Web application, a single record in the data source is displayed in one row, while one of the columns displays a specific field value. The DataGrid control itself provides us with powerful capabilities, so we need to be able to display the data with very little code. However, this also poses a problem, that is, how do we personalize the way the data is displayed? Obviously DataList controls and repeater controls are better at this than the DataGrid controls, but if we give up the DataGrid control it is equivalent to giving up the power that it has. So how do we use the DataGrid control to implement the custom features of data display? First, we turn off the DataGrid control by automatically generating data-bound columns from the data source, simply by setting its AutoGenerateColumns property to False. Here is an example of this approach:

<asp:datagrid runat= "Server" id= "Mydatagrid" autogeneratecolumns= "False"
</asp:DataGrid>

Once its AutoGenerateColumns property is false, we have to programmatically implement the binding of the data column. In the process of binding a data column, we can use any of the V data columns described above, but any data column must be defined within the <Columns> </Columns> tag, which indicates that the object being defined is a data column.

Let's first introduce the application of BoundColumn data columns. By using BoundColumn data columns, we can dynamically bind data from a data source to a specific data column and modify the appearance of the data column to suit our needs, such as changing the order in which columns are displayed, and allowing the DataGrid control to display only the values of certain fields, not the values of all fields, Change the title of the data column, and so on. BoundColumn data columns can set properties such as DataField, DataFormatString, Footertext, HeaderText, Headerimageurl, and SortField. And that's what makes the DataGrid control look so changeable and colourful.

Next, we build an example Web application project that works with the DataGrid control and shows how to use BoundColumn data columns to customize how data is displayed. The following is the main file for this project and the contents of its code-behind file:

WebForm1.aspx:

<%@ Page language= "C #" codebehind= "WebForm1.aspx.cs" autoeventwireup= "false" inherits= "Datagridtemplates.webform1"% >
! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//en"
<HTML>
<HEAD>
<title> WebForm1 </title>
<meta name= "generator" content= "Microsoft Visual Studio 7.0"
<meta name= "Code_language" content= "C #"
<meta name= "vs_defaultClientScript" content= "JavaScript"
<meta name= "vs_targetschema" content= "http://schemas.microsoft.com/intellisense/ie5"
</HEAD>
<body>
<form id= "Form1" method= "POST" runat= "Server"
<asp:datagrid runat= "Server" id= "Mydatagrid" autogeneratecolumns= "False" borderwidth= "1px" font-names= "Verdana, Arial,sans-serif "font-size=" 12px "bordercolor=" #404040 "gridlines=" Horizontal "cellpadding=" 4 "
<alternatingitemstyle backcolor= "#E0E0E0" > </AlternatingItemStyle>
<Columns>
<asp:boundcolumn datafield= "CustomerID" headertext= "ID" > </asp:BoundColumn>
<asp:boundcolumn datafield= "CompanyName" headertext= "Company Name" > </asp:BoundColumn>
<asp:boundcolumn datafield= "ContactName" headertext= "Contact Name" > </asp:BoundColumn>
<asp:boundcolumn datafield= "Address" headertext= "address" > </asp:BoundColumn>
<asp:boundcolumn datafield= "City" headertext= "City" > </asp:BoundColumn>
<asp:boundcolumn datafield= "Region" headertext= "Region" > </asp:BoundColumn>
<asp:boundcolumn datafield= "PostalCode" headertext= "Postal Code"
</asp:BoundColumn>
</Columns>
</asp:DataGrid>
</form>
</body>
</HTML>

WebForm1.aspx.cs:
Using System;
Using System.Collections;
Using System.ComponentModel;
Using System.Data;
Using System.Data.SqlClient;
Using System.Drawing;
Using System.Web;
Using System.Web.SessionState;
Using System.Web.UI;
Using System.Web.UI.WebControls;
Using System.Web.UI.HtmlControls;

Namespace Datagridtemplates
{

Summary description of the WebForm1.

public class WebForm1:System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid Mydatagrid;

private void Page_Load (object sender, System.EventArgs e)
{
Place user code here to initialize page
if (! Page.IsPostBack)
Binddata ();
}

private void Binddata ()
{
SqlConnection con = new SqlConnection ("server=localhost;database=northwind;integrated security=true;");
SqlCommand cmd = new SqlCommand ("SELECT * from Customers", con);

Try
{
Con. Open ();
Mydatagrid.datasource = cmd. ExecuteReader ();
Mydatagrid.databind ();
Con. Close ();
}
catch (Exception) {}
if (con!= null && con. state = = ConnectionState.Open)
Con. Close ();
}

#region Web Form Designer generated code
Override protected void OnInit (EventArgs e)
{
//
CodeGen: This call is required for the ASP.net Web forms Designer.
//
InitializeComponent ();
Base. OnInit (e);
}

Designer supports required methods-do not use the Code editor to modify
The contents of this method.

private void InitializeComponent ()
{
This. Load + = new System.EventHandler (this. Page_Load);
}
#endregion
}
}

When the project is created, the effect that runs in the browser is as shown in Figure 1:

Figure 1 The effect of using BoundColumn data columns to display data in the DataGrid control.

[1] [2] [3] Next page

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More