preface
In the first part we studied the basic functions of DataGrid, it can display data in the HTML table. In the first part, I explain that it is very simple to bind the database content to the DataGrid. What we have to do is to generate a DataReader object through the SQL query, set the DataGrid's DataSource property to this DataReader object, and then call the DataGrid object's DataBind ()method. The rest of the thing is to place the DataGrid into the HTML, which can be implemented by the following code:
It is so simple. Regrettably, the DataGrid generated through this simple method is not beautiful. The generated DataGrid is just a simple HTML table encapsulated in the DataReader.
We want to do only display only part of the DataReader and set the format of each column. And it is desirable to set the format that can be applied to the entire table such as a background color, font, and the like. Finally, if you can add a custom title for each column. For example, the background color of the set title is a different color or font as a bold. In this section we will study how to complete all these tasks! (DataGrid can do more things, we will see how to display database results in a series of articles, allowing users to sort data.)
Set DataGrid format
We have two ways to set formats for DataGrid. The first method is to set by the program in the server-side code. For example, in order to set the background color of the DataGrid to red, you can use the following server-side code:
<% @ Import namespace = "system.drawing"%>
SUB Page_Load (Sender As Object, E as Eventargs)
...
DataGridId.backcolor = color.red
...
End Sub
script>
Another way to set the display attribute is to set in the tag of the DataGrid web control. The following code is the same as the code effect:
I personally like the latter method. I found that setting the display attribute in the tag of the web control is comparable to the server-side code. (Note that for the server-side code, you need to introduce the system.drawing namespace to reference the color through the color.red; for the method of setting the display attribute in the markup of the web control, only write backcolor = " "I think the latter method is more readable.)
Let's take a look at the useful properties used to set the DataGrid format:
l Backcolor - Set the background color.
l Font - Set the font information of the DataGrid. Font information includes what fonts, font numbers, bold, oblique, and the like.
l Cellpadding - Sets the margins in the cell in the HTML table.
l Cellspacing - Set the spacing between cells between the HTML table.
l Width - Set the width of the HTML table (can be pixel, percentage, etc.)
l Horizontalalign - Set the alignment form on the page (left alignment, right alignment, center, not set)
An example of using the above properties such that the table becomes beautiful is shown below. Note that the DataGrid's font property is an object, which points to the FontInfo class, the Fontinfo class includes attributes such as size, name, bold, italic. To set the properties of the Font object to the class, you must be done by even character (-). This is similar to the point (.) That represents the object attribute in the VB.NET and C # language. BackColor = "# eeeeee" width = "85%" Horizontalalign = "center" Font-bold = "true" font-name = "verdana" Font-size = " 10PT "/> FAQID Description ... Datentered Catname 144 WHERE CAN I HOST MY ASP Web Site for Free (SIMILAR TO Geocities or tripod or any of the many Other Free Web Site Sites)? 3/20/2001 2:53:45 am Getting start 181 How can I Format NumBers and Date / Times Using ASP.NET? For Example, I Want To Format A Number As a Currency. 1/19/2002 3:12:07 PM ASP.NET ... Databases, Errors Is it impressed? Through a few lines of text, we changed the appearance of DataGrid and generated a html form that centered, with gray and beautiful fonts. Play your imagination through style The DataGrid Web control contains some styles that you will find that the appearance of the DataGrid through style is very effective. These styles support a lot of properties, including Backcolor, Forecolor, Horizontalalign, and Width. (More information can be obtained). DataGrid includes four types of style: l HEADERSTYLE - Set the pattern of header. (The top of the header is the top line, it lists the names of each column. To display the header, you need to set the DataGrid's ShowHeader property to True (default true)) l Footerstyle - Set the style of the footer. (The bottom line of the page is the bottom line. To display the footer, you need to use the DataGrid's showfooter property true (default false) l ItemStyle - Set the style of each line in the table. l AlternatingItemStyle - Set the style of the alternate row in the table. The DataGrid is easy to read by setting ItemStyle and AlternatingItemStyle to different values. (Refer to the example below) Similar to the format of the setting DataGrid, the style can be set by the tag of the program or the DataGrid web control. As mentioned above, I personally like to use the web control tag and will use the method in the example. The first method is similar to the format that sets the DataGrid through the code, and by adding a point behind the object. That is, if you want to set the Headerstyle's BackColor, you can implement it in the code via Headerstyle.backColor = Color.red. Another method is to use special style blocks in the mark of the web control, as shown below: ask: DataGrid> Both methods are feasible. I found that the method of embedded tags is for reading, especially when you need to set a wide range of properties for many styles. The following example shows how to beautify the previous example: BackColor = "# eeeeee" width = "85%" Horizontalalign = "center" Font-name = "verdana" Font-size = " 10PT "> Font-bold = "true" horizontalalign = "center" /> ask: DataGrid> The example operation results are as follows: FAQID Description Viewcount FAQCATEGORYID Datentered 144 WHERE CAN I HOST MY ASP Web Site for Free (SIMILAR TO Geocities or tripod or any of the many Other Free Web Site Sites)? 161319 ... 20 3/20/2001 2:53:45 am 181 How can I Format NumBers and Date / Times Using ASP.NET? For Example, I Want To Format A Number As a Currency. 124398 twenty two 1/19/2002 3:12:07 PM 115 I am using Access and getting a 80004005 error (or a [Microsoft] [ODBC Microsoft Access Driver] The Microsoft Jet database engine can not open the file '(unknown)' error) when trying to open a connection! How can I fix this problem ? 108377 twenty one 1/17/2001 11:38:49 PM ... Now we have studied how to use styles and how to set the global display properties (format) of the DataGrid control, and you will also need to have a topic: How to set the style and display properties for each specific column. We will discuss this technology in the second part of this article.