Beginning ASP.NET 4.5 in CSharp and VB Opsylum

560 x CHAPTER 15 WORKING WITH DATA — ADVANCED TOPICS
2. Right-click this new folder and choose Add Í Add New Item.
Add a skin file called GridView.skin. You should end up with a
Solution Explorer looking like Figure 15-5.
3. Open the Genres.aspx page in Markup View and
delete all the style elements you created in the previous
exercise except the HeaderStyle, the PagerStyle,
the SortedAscendingHeaderStyle, and the
SortedDescendingHeaderStyle. From the four remaining styles,
remove all attributes and replace them with a single CssClass
attribute named after the style and prefixed with GridView. You
should end up with the following styles:
FIGURE 15-5
Don’t worry if VS adds red error lines under the CSS class names. Because the CSS classes aren’t
defined yet, it can’t find them. Later, you add them to the theme’s CSS file, where VS still can’t
find them. They’ll work fine at run time, though, so don’t worry.
4. Select the styles in the code editor and then cut them to the clipboard using Ctrl+X. Switch to the
GridView.skin file, delete all existing code (the comment text you saw earlier), and paste the
styles into the skin file.
5. Wrap the styles in an element with its runat attribute set to server and its
CssClass attribute set to GridView. Don’t add an ID attribute, because skin files don’t need this.
You should end up with this code:
... styles go here
6. Open the resources folder for this chapter (located at C:\
BegASPNET\Resources\Chapter 15 if you followed the instructions
in the Introduction section of this book) in File Explorer
(Windows Explorer in Windows 7), select the Images folder and
the Management.css file, and press Ctrl+C to copy them. Switch
back to VS, click the Management folder under App_Themes, and
press Ctrl+V. Just as the other two themes do, the management
theme now has its own style sheet and Images folder, shown in
Figure 15-6.
The two images are used to change the header for sorted columns
in the GridView, as you will see later.
FIGURE 15-6
7. Open the Web.config file for the Management folder in the root that you added earlier and set the
theme to Management: