11. display data in the database in a table

I. Create a model
The following figure shows the data in the movies table. The structure of the movies table is as follows:
IDInt false
TitleNvarchar (200) False
DirectorNvarchar (50) False
DatereleasedDatetime false
We use LINQ to SQL as the Data Access Technology for displaying movies tables. In other words, we use LINQ to SQL to write our MVC model class.
Right-click solution manager and select "add"-"new item". In the displayed dialog box, select the LINQ to SQL classes template and name it movie. dbml: click "add.

Figure 1
After creating a LINQ to SQL classes, the object relational designer is displayed. We drag the movies table from the Server Explorer window to the object relational designer, so that it creates the LINQ to SQL class.

Figure 2
By default, Object Relational designer names the LINQ to SQL class according to the table name in the database. That is, when we drag the customer table to the object relational designer, the user will automatically create the customer-specific LINQ to SQL class for us. In the designer, We can click the table name to modify the class name.
Click "save". Otherwise, the object relational designer will not automatically generate the LINQ to SQL class.

2. Use LINQ to SQL in controller actions(Original: grey WormHttp://hi.baidu.com/grayworm)
Now that we have the LINQ to SQL class, we can use these classes to retrieve data from the database. The following Controller Code That is, data is retrieved from the movies table using the LINQ to SQL class.
Listing 1-controllers \ homecontroller. CS
Using system. LINQ;
Using system. Web. MVC;
Using mvcapplication1.models;
Namespace mvcapplication1.controllers
{
[Handleerror]
Public class homecontroller: Controller
{
Public Actionresult index ()
{
VaR datacontext = new moviedatacontext ();
VaR movies = from m in datacontext. Movies select m;
Return view (movies );
}
}
}
The index () action above uses the moviedatacontext class in LINQ to SQL to retrieve data from the movies table and pass the movies table record set to the view through the viewdata. model attribute.

3. Format and display data on The View Layer(Original: grey WormHttp://hi.baidu.com/grayworm)
The simplest way is to format the view directly. For example, in the following code, the data in the movies table is directly displayed in the HTML table.
Listing 2-views \ home \ index. aspx
<% @ Page Language = "C #" masterpagefile = "~ /Views/shared/site. Master "autoeventwireup =" true "codebehind =" index. aspx. cs "inherits =" mvcapplication1.views. Home. Index "%>
<% @ Import namespace = "mvcapplication1.models" %>
<Asp: Content ID = "indexcontent" contentplaceholderid = "maincontent" runat = "server">
<Table>
<Tr>
<TH> id </Th> <TH> title </Th> <TH> release date </Th>
</Tr>
<% Foreach (movie m in (ienumerable) viewdata. Model) {%>
<Tr>
<TD> <% = M. ID %> </TD> <TD > <% = Html. encode (M. Title) %> </TD> <TD> <% = M. datereleased %> < / TD>
</Tr>
<% }%>
</Table>
</ASP: content>
The code above contains a foreach loop, which enumerates the values in the movies set, so the attributes of each movie object are displayed in the table.
Note that When the movies attribute is displayed in the table, the HTML. encode () method is added. When receiving user input data and displaying data on the page, we should use the HTML. encode () method to prevent javascript injection attacks.
Dynamic Interface:

Figure 3
The HTML table shown above is not very exciting for us (because the interface is not very friendly ). We can use CSS style sheets to improve the appearance of HTML tables. Because the above table only shows the content, we should add a style sheet to the Listing 3-Cascading Style Sheet
<Style type = "text/CSS">
Table
{
Border-collapse: collapse;
}
Table TD, table th
{
Border: solid 1px black;
Padding: 10px;
}
</Style>
The above style sheet adds a grid line between cells. When we add this CSS style table to the master page, the index view is shown as follows:

Figure 4

4. Format part
In addition to formatting all data at the view layer as mentioned above, we can also display only one row of the database in a formatted manner as in the template. The following code only shows the contents of the first database record.
Listing 4-\ views \ movies \ movietemplate. ascx
<% @ Control Language = "C #" autoeventwireup = "true" codebehind = "movietemplate. ascx. cs" inherits = "mvcapplication1.views. Movies. movietemplate" %>
<Tr>
<TD><% = Viewdata. model. ID %></TD>
<TD><% = Html. encode (viewdata. model. Title) %></TD>
<TD><% = Viewdata. model. datereleased. tostring ("D") %></TD>
</Tr>
From the code template above, we can see that each line of movie record is formatted as an HTML line. Note that the viewdata. model attribute is not a record set but a record of a table.
Viewdata. the model attribute is changed to an instance of the movies class. We need to make the following settings in the Post-code class. From the code below, we can see that the post-Code Partial class no longer inherits from page or control, instead, it is derived from system. web. MVC. viewusercontrol <movie> generic set, where each element is of the movie type.
Listing 5-\ views \ movies \ movietemplate. ascx. CS
Using mvcapplication1.models;
Namespace mvcapplication1.views. Movies
{
Public partial classMovietemplate:System. Web. MVC. viewusercontrol <movie>
{
}
}
From the code above, we can see that the movietemplate class is derived from the viewusercontrol <movie> class, so the viewdata. model attribute is automatically converted into a movie object.

The following code shows how to use the movietemplate class in the view. The HTML. renderpartial () method is used to display the movietemplate list.
Listing 6-\ views \ movies \ index. aspx
<% @ page title = "" Language = "C #" masterpagefile = "~ /Views/shared/site. master "autoeventwireup =" true "codebehind =" index. aspx. CS "inherits =" mvcapplication1.views. movies. index "%>
<% @ import namespace =" mvcapplication1.models "%>





<% foreach (movie m in (ienumerable) viewdata. model)
{< br> HTML. renderpartial ("movietemplate", m);
}%>

id	title	release date

In the above Code, The HTML. renderpartial () method uses the movietemplate class to display each movie data. The renderpartial () method receives two parameters. The first parameter is the name of the template class to be displayed (similar to the view, by default, by default, the template class must be placed in the Views \ controllername folder or views \ shared folder). The second parameter specifies the value passed to the template class, which is the instance object to be displayed in the template class, that is, viewdata in the template. the value of the model attribute.
A very important thing should be noted: The HTML. renderpartial () method does not return strings as other helper methods do. This means that we cannot call the HTML. renderpartial () method in the following way.
<% = Html. renderpartial ("movietemplate", m) %>
The following call method should be used:
<% Html. renderpartial ("movietemplate", m); %>

Summary
This articleArticleThis section describes how to display table data in a database as an HTML table. We used two methods to format the data in the display table:
Method 1: format the data display directly in the view.
Method 2: Use the ascx template to format the display of a record, and then use HTML. renderpartial () in the view to display all records.