The ASP.NET DataGrid | Programming Data-Driven Web Applications with ASP.NET

only for RuBoard

The DataGrid server control is a multicolumn data-bound grid control now say that five times fast! In English, the DataGrid renders a basic HTML <table> element. In its most basic form, the DataGrid renders a <table> element with <tr> elements for each row in its data source and <td> elements for each column in the row. The DataGrid also supports selecting, editing, sorting, and paging the data, as well as customizing the layout of the data. This chapter is going to show you a basic DataGrid and introduce you to the concept of data binding. In Chapter 6, "Altering DataGrid Output," you'll see how to use properties of the DataGrid to customize its output. In Chapter 10, "Inputting and Editing Data with the DataGrid and DataList ," you'll delve into the editing functionality of the DataGrid .

The DataGrid is a control from the System.Web.UI.WebControls namespace. It's the first of three data server controls. The others are the DataList and the Repeater , which you'll learn about in Chapter 7, "Working With ASP.NET Server Controls Templates."

Note

Unlike the namespaces you saw in Chapter 3, System.Data , System.Data.SqlClient and System.Data.OleDb , you don't have to import the System.Web.UI.WebControls namespace to use the DataGrid on a Web Form. It's imported by default for all ASP.NET pages.

As with all ASP.NET intrinsic controls, you use the prefix asp when placing the DataGrid on an ASP.NET page and include the runat ="server" property/value pair to identify it as a server control. This notifies the .NET Framework that this server control is to be processed on the server and rendered as HTML output appropriate for the browser making the request:

 <asp:DataGrid runat="server" />

You can have any number of DataGrid controls on one Web Form. Listing 5.1 demonstrates how to add a DataGrid to an ASP.NET Web Form.

Listing 5.1 Adding the DataGrid to an ASP.NET Web Form

 01:  <%@ Page Language="  [VB  C#]  "%> 02:  <html> 03:  <head> 04:   <script runat="server"> 05:   </script> 06:  </head> 07:  <body> 08:   <asp:DataGrid id="myDataGrid" runat="server" /> 09:  </body> 10:  </html>

On line 8 of Listing 5.1 you place the DataGrid control, indicating that it's a server control with the runat="server" property/value pair. You add the ID property so you can have declarative control over the DataGrid . Using the ID property enables you to reference the DataGrid object by name . You can then declaratively set its properties, such as its DataSource property, and call its methods , such as DataBind() .

only for RuBoard