- •Table of Contents
- •Preface
- •What is ASP.NET?
- •Installing the Required Software
- •Installing the Web Server
- •Installing Internet Information Services (IIS)
- •Installing Cassini
- •Installing the .NET Framework and the SDK
- •Installing the .NET Framework
- •Installing the SDK
- •Configuring the Web Server
- •Configuring IIS
- •Configuring Cassini
- •Where do I Put my Files?
- •Using localhost
- •Virtual Directories
- •Using Cassini
- •Installing SQL Server 2005 Express Edition
- •Installing SQL Server Management Studio Express
- •Installing Visual Web Developer 2005
- •Writing your First ASP.NET Page
- •Getting Help
- •Summary
- •ASP.NET Basics
- •ASP.NET Page Structure
- •Directives
- •Code Declaration Blocks
- •Comments in VB and C# Code
- •Code Render Blocks
- •ASP.NET Server Controls
- •Server-side Comments
- •Literal Text and HTML Tags
- •View State
- •Working with Directives
- •ASP.NET Languages
- •Visual Basic
- •Summary
- •VB and C# Programming Basics
- •Programming Basics
- •Control Events and Subroutines
- •Page Events
- •Variables and Variable Declaration
- •Arrays
- •Functions
- •Operators
- •Breaking Long Lines of Code
- •Conditional Logic
- •Loops
- •Object Oriented Programming Concepts
- •Objects and Classes
- •Properties
- •Methods
- •Classes
- •Constructors
- •Scope
- •Events
- •Understanding Inheritance
- •Objects In .NET
- •Namespaces
- •Using Code-behind Files
- •Summary
- •Constructing ASP.NET Web Pages
- •Web Forms
- •HTML Server Controls
- •Using the HTML Server Controls
- •Web Server Controls
- •Standard Web Server Controls
- •Label
- •Literal
- •TextBox
- •HiddenField
- •Button
- •ImageButton
- •LinkButton
- •HyperLink
- •CheckBox
- •RadioButton
- •Image
- •ImageMap
- •PlaceHolder
- •Panel
- •List Controls
- •DropDownList
- •ListBox
- •RadioButtonList
- •CheckBoxList
- •BulletedList
- •Advanced Controls
- •Calendar
- •AdRotator
- •TreeView
- •SiteMapPath
- •Menu
- •MultiView
- •Wizard
- •FileUpload
- •Web User Controls
- •Creating a Web User Control
- •Using the Web User Control
- •Master Pages
- •Using Cascading Style Sheets (CSS)
- •Types of Styles and Style Sheets
- •Style Properties
- •The CssClass Property
- •Summary
- •Building Web Applications
- •Introducing the Dorknozzle Project
- •Using Visual Web Developer
- •Meeting the Features
- •The Solution Explorer
- •The Web Forms Designer
- •The Code Editor
- •IntelliSense
- •The Toolbox
- •The Properties Window
- •Executing your Project
- •Using Visual Web Developer’s Built-in Web Server
- •Using IIS
- •Using IIS with Visual Web Developer
- •Core Web Application Features
- •Web.config
- •Global.asax
- •Using Application State
- •Working with User Sessions
- •Using the Cache Object
- •Using Cookies
- •Starting the Dorknozzle Project
- •Preparing the Sitemap
- •Using Themes, Skins, and Styles
- •Creating a New Theme Folder
- •Creating a New Style Sheet
- •Styling Web Server Controls
- •Adding a Skin
- •Applying the Theme
- •Building the Master Page
- •Using the Master Page
- •Extending Dorknozzle
- •Debugging and Error Handling
- •Debugging with Visual Web Developer
- •Other Kinds of Errors
- •Custom Errors
- •Handling Exceptions Locally
- •Summary
- •Using the Validation Controls
- •Enforcing Validation on the Server
- •Using Validation Controls
- •RequiredFieldValidator
- •CompareValidator
- •RangeValidator
- •ValidationSummary
- •RegularExpressionValidator
- •Some Useful Regular Expressions
- •CustomValidator
- •Validation Groups
- •Updating Dorknozzle
- •Summary
- •What is a Database?
- •Creating your First Database
- •Creating a New Database Using Visual Web Developer
- •Creating Database Tables
- •Data Types
- •Column Properties
- •Primary Keys
- •Creating the Employees Table
- •Creating the Remaining Tables
- •Executing SQL Scripts
- •Populating the Data Tables
- •Relational Database Design Concepts
- •Foreign Keys
- •Using Database Diagrams
- •Diagrams and Table Relationships
- •One-to-one Relationships
- •One-to-many Relationships
- •Many-to-many Relationships
- •Summary
- •Speaking SQL
- •Reading Data from a Single Table
- •Using the SELECT Statement
- •Selecting Certain Fields
- •Selecting Unique Data with DISTINCT
- •Row Filtering with WHERE
- •Selecting Ranges of Values with BETWEEN
- •Matching Patterns with LIKE
- •Using the IN Operator
- •Sorting Results Using ORDER BY
- •Limiting the Number of Results with TOP
- •Reading Data from Multiple Tables
- •Subqueries
- •Table Joins
- •Expressions and Operators
- •Transact-SQL Functions
- •Arithmetic Functions
- •String Functions
- •Date and Time Functions
- •Working with Groups of Values
- •The COUNT Function
- •Grouping Records Using GROUP BY
- •Filtering Groups Using HAVING
- •The SUM, AVG, MIN, and MAX Functions
- •Updating Existing Data
- •The INSERT Statement
- •The UPDATE Statement
- •The DELETE Statement
- •Stored Procedures
- •Summary
- •Introducing ADO.NET
- •Importing the SqlClient Namespace
- •Defining the Database Connection
- •Preparing the Command
- •Executing the Command
- •Setting up Database Authentication
- •Reading the Data
- •Using Parameters with Queries
- •Bulletproofing Data Access Code
- •Using the Repeater Control
- •More Data Binding
- •Inserting Records
- •Updating Records
- •Deleting Records
- •Using Stored Procedures
- •Summary
- •DataList Basics
- •Handling DataList Events
- •Editing DataList Items and Using Templates
- •DataList and Visual Web Developer
- •Styling the DataList
- •Summary
- •Using the GridView Control
- •Customizing the GridView Columns
- •Styling the GridView with Templates, Skins, and CSS
- •Selecting Grid Records
- •Using the DetailsView Control
- •Styling the DetailsView
- •GridView and DetailsView Events
- •Entering Edit Mode
- •Using Templates
- •Updating DetailsView Records
- •Summary
- •Advanced Data Access
- •Using Data Source Controls
- •Binding the GridView to a SqlDataSource
- •Binding the DetailsView to a SqlDataSource
- •Displaying Lists in DetailsView
- •More on SqlDataSource
- •Working with Data Sets and Data Tables
- •What is a Data Set Made From?
- •Binding DataSets to Controls
- •Implementing Paging
- •Storing Data Sets in View State
- •Implementing Sorting
- •Filtering Data
- •Updating a Database from a Modified DataSet
- •Summary
- •Security and User Authentication
- •Basic Security Guidelines
- •Securing ASP.NET 2.0 Applications
- •Working with Forms Authentication
- •Authenticating Users
- •Working with Hard-coded User Accounts
- •Configuring Forms Authentication
- •Configuring Forms Authorization
- •Storing Users in Web.config
- •Hashing Passwords
- •Logging Users Out
- •ASP.NET 2.0 Memberships and Roles
- •Creating the Membership Data Structures
- •Using your Database to Store Membership Data
- •Using the ASP.NET Web Site Configuration Tool
- •Creating Users and Roles
- •Changing Password Strength Requirements
- •Securing your Web Application
- •Using the ASP.NET Login Controls
- •Authenticating Users
- •Customizing User Display
- •Summary
- •Working with Files and Email
- •Writing and Reading Text Files
- •Setting Up Security
- •Writing Content to a Text File
- •Reading Content from a Text File
- •Accessing Directories and Directory Information
- •Working with Directory and File Paths
- •Uploading Files
- •Sending Email with ASP.NET
- •Configuring the SMTP Server
- •Sending a Test Email
- •Creating the Company Newsletter Page
- •Summary
- •The WebControl Class
- •Properties
- •Methods
- •Standard Web Controls
- •AdRotator
- •Properties
- •Events
- •BulletedList
- •Properties
- •Events
- •Button
- •Properties
- •Events
- •Calendar
- •Properties
- •Events
- •CheckBox
- •Properties
- •Events
- •CheckBoxList
- •Properties
- •Events
- •DropDownList
- •Properties
- •Events
- •FileUpload
- •Properties
- •Methods
- •HiddenField
- •Properties
- •HyperLink
- •Properties
- •Image
- •Properties
- •ImageButton
- •Properties
- •Events
- •ImageMap
- •Properties
- •Events
- •Label
- •Properties
- •LinkButton
- •Properties
- •Events
- •ListBox
- •Properties
- •Events
- •Literal
- •Properties
- •MultiView
- •Properties
- •Methods
- •Events
- •Panel
- •Properties
- •PlaceHolder
- •Properties
- •RadioButton
- •Properties
- •Events
- •RadioButtonList
- •Properties
- •Events
- •TextBox
- •Properties
- •Events
- •Properties
- •Validation Controls
- •CompareValidator
- •Properties
- •Methods
- •CustomValidator
- •Methods
- •Events
- •RangeValidator
- •Properties
- •Methods
- •RegularExpressionValidator
- •Properties
- •Methods
- •RequiredFieldValidator
- •Properties
- •Methods
- •ValidationSummary
- •Properties
- •Navigation Web Controls
- •SiteMapPath
- •Properties
- •Methods
- •Events
- •Menu
- •Properties
- •Methods
- •Events
- •TreeView
- •Properties
- •Methods
- •Events
- •HTML Server Controls
- •HtmlAnchor Control
- •Properties
- •Events
- •HtmlButton Control
- •Properties
- •Events
- •HtmlForm Control
- •Properties
- •HtmlGeneric Control
- •Properties
- •HtmlImage Control
- •Properties
- •HtmlInputButton Control
- •Properties
- •Events
- •HtmlInputCheckBox Control
- •Properties
- •Events
- •HtmlInputFile Control
- •Properties
- •HtmlInputHidden Control
- •Properties
- •HtmlInputImage Control
- •Properties
- •Events
- •HtmlInputRadioButton Control
- •Properties
- •Events
- •HtmlInputText Control
- •Properties
- •Events
- •HtmlSelect Control
- •Properties
- •Events
- •HtmlTable Control
- •Properties
- •HtmlTableCell Control
- •Properties
- •HtmlTableRow Control
- •Properties
- •HtmlTextArea Control
- •Properties
- •Events
- •Index
Chapter 11: Managing Content Using Grid View and Details View
Figure 11.5. The styled address book
All the styling we need is already defined in the skin file; we’d only need to define new properties if we wanted to alter the default values provided through the skin file. Save your work and view the results in the browser. Do they look like the display in Figure 11.5?
Congratulations! You’ve harnessed the power of CSS and skin files, and combined it with the flexibility of GridView to easily create a good-looking address book!
As you can see, you can style the items in the GridView by altering their font types, colors, and sizes. You can also style the column headers and apply an alternating item style to alternate rows in the table. Now, when the GridView is viewed in the browser, we see a little more room between cells, and the lines surrounding the GridView are gone.
Selecting Grid Records
We’ve already made quite a few changes to the display of our GridView. The next step will be to allow users to select one of the rows in the GridView so they can view more information about the selected employee.
440
Selecting Grid Records
There are several types of columns that we can create in a GridView in addition to the BoundField columns we’ve already seen. For instance, we could create a ButtonField column, which displays a button in each row. The complete set of column controls and their descriptions are listed here:
BoundField
As you’ve seen, the BoundField provides flexibility in presentation by allowing you to specify which columns will appear within the GridView. When the grid enters edit mode, this field renders itself as an editable text box, as we’ll see later.
ButtonField
Use the ButtonField to display a clickable button for each row within the GridView. When clicked, the button triggers a configurable event that you can handle within your code to respond to the user’s action. The possible event types that a button can trigger are: Cancel, Delete, Edit, Select, and
Update.
CheckBoxField
The CheckBoxField displays a checkbox in each row, allowing you to easily present Boolean data in the display.
CommandField
The CommandField column automatically generates a ButtonField in your grid. The actions performed by these buttons depend on the grid’s current state. For example, if CommandField is set to generate Edit buttons, it will display an Edit button when the grid is in non-editable mode, and will display
Update and Cancel buttons when the grid is being edited.
HyperLinkField
Use the HyperLinkField to display a clickable link within the GridView. This link simply acts as a hyperlink to a URL; it raises no server-side events.
ImageField
This control displays an image inside your grid.
TemplateField
Use the TemplateField to display markup within the GridView.
441
Chapter 11: Managing Content Using Grid View and Details View
Figure 11.6. Adding a new GridView column
If you’re using Visual Web Developer, you can quickly and easily add a new column to your table in Design View. Click the GridView’s smart tag, and click the Add New Column... item, as shown in Figure 11.6.
In the dialog that appears, change the field type to ButtonField, the command name to Select, and set the Text field to Select, so the dialog appears as it does in Figure 11.7.
Figure 11.7. Adding a new field
After clicking OK, your brand new column shows up in Design View. If you switch to Source View, you can see it there, too:
File: AddressBook.aspx (excerpt)
<asp:GridView ID="grid" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="Name" HeaderText="Name" /> <asp:BoundField DataField="City" HeaderText="City" />
442
Selecting Grid Records
<asp:BoundField DataField="MobilePhone" HeaderText="Mobile Phone" />
<asp:ButtonField CommandName="Select" Text="Select" />
</Columns>
</asp:GridView>
If you execute the project now, and click the new button, the row will become highlighted, as Figure 11.8 indicates. Notice that you didn’t write any code to implement this feature? We’re relying on the functionality provided by the ButtonField control when it’s CommandName property is set to Select, and the style settings you set earlier, to produce this functionality.
Figure 11.8. Highlighting the selected field in the Address Book
We usually want extra work—in addition to the row highlight—to be performed when a user selects a row in the address book. When the Select button is pressed, the GridView fires the SelectedIndexChanged event, which we handle if we need to do any further processing. We can generate the GridView’s SelectedIndexChanged event handler simply by double-clicking the GridView in the Visual Web Developer designer.
443
Chapter 11: Managing Content Using Grid View and Details View
Generating Default Event Handlers
Double-clicking a control in the designer causes Visual Web Developer to generate the handler of the control’s default event. The default event of the GridView is SelectedIndexChanged, which explains why it’s so easy to generate its signature. Remember that you can use the Properties window to have Visual Web Developer generate handlers for other events—just click the lightning icon in the Properties window, then double-click on any of the listed events.
Before we handle the SelectedIndexChanged event, let’s add just below the GridView control in AddressBook.aspx a label that we can use to display some details of the selected record. You can use Visual Web Developer’s designer to add the control, or you can write the code manually:
File: AddressBook.aspx (excerpt)
</asp:GridView>
<br />
<asp:Label ID="detailsLabel" runat="server" />
</asp:Content>
Now, generate the SelectedIndexChanged event handler by double-clicking the GridView control in Design View, then update the event handler to display a short message about the selected record:
Visual Basic |
File: AddressBook.aspx.vb (excerpt) |
Protected Sub grid_SelectedIndexChanged(ByVal sender As Object, _ ByVal e As System.EventArgs) Handles grid.SelectedIndexChanged
'Obtain the index of the selected row Dim selectedRowIndex As Integer selectedRowIndex = grid.SelectedIndex
'Read the name from the grid
Dim row As GridViewRow = grid.Rows(selectedRowIndex) Dim name As String = row.Cells(0).Text
' Update the details label
detailsLabel.Text = "You selected " & name & "." End Sub
C# File: AddressBook.aspx.cs (excerpt)
protected void grid_SelectedIndexChanged(object sender, EventArgs e)
{
// Obtain the index of the selected row int selectedRowIndex;
selectedRowIndex = grid.SelectedIndex;
444