ASP.NET Web Pages Using The Razor Syntax

Microsoft® ASP.NET Web Pages is a free Web development technology that is designed to deliver the world's best experience for Web developers who are building websites for the Internet. This book provides an overview of how to create dynamic Web content using ASP.NET Web Pages with the Razor syntax.

Note This document is preliminary documentation for the Beta 3 release of WebMatrix and ASP.NET Web pages and is subject to change. For the latest information, visit http://www.asp.net/webmatrix.

Contents

Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages ...... 1 What is WebMatrix Beta? ...... 1 Installing WebMatrix Beta ...... 1 Getting Started with WebMatrix Beta ...... 2 Creating a Web Page ...... 4 Installing Helpers with ...... 7 Using ASP.NET Web Pages Code ...... 9 Programming ASP.NET Razor Pages in Visual Studio ...... 12 Creating and Testing ASP.NET Pages Using Your Own Text Editor ...... 13 Chapter 2 – Introduction to ASP.NET Web Programming Using the Razor Syntax ...... 15 The Top 8 Programming Tips ...... 15 HTML Encoding ...... 16 HTTP GET and POST Methods and the IsPost Property ...... 21 A Simple Code Example ...... 22 Basic Programming Concepts ...... 24 Classes and Instances...... 25 Language and Syntax ...... 26 Additional Resources ...... 47 Chapter 3 – Creating a Consistent Look ...... 48 Creating Reusable Blocks of Content ...... 48 Creating a Consistent Look Using Layout Pages ...... 51 Designing Layout Pages That Have Multiple Content Sections ...... 55 Making Content Sections Optional ...... 58 Passing Data to Layout Pages ...... 59 Creating and Using a Basic Helper ...... 65

Chapter 4 – Working with Forms ...... 67 Creating a Simple HTML Form ...... 67 Reading User Input From the Form ...... 68 HTML Encoding for Appearance and Security ...... 70 Validating User Input ...... 71 Restoring Form Values After Postbacks ...... 73 Additional Resources ...... 74 Chapter 5 – Working with Data ...... 75 Introduction to Databases ...... 75 Relational Databases ...... 76 Creating a Database ...... 76 Adding Data to the Database ...... 78 Displaying Data from a Database ...... 79 Structured Query Language (SQL)...... 81 Inserting Data in a Database ...... 82 Updating Data in a Database ...... 86 Deleting Data in a Database ...... 91 Connecting to a Database ...... 95 Additional Resources ...... 96 Chapter 6: Displaying Data in a Grid ...... 97 The WebGrid Helper ...... 97 Displaying Data Using the WebGrid Helper...... 97 Specifying and Formatting Columns to Display ...... 99 Styling the Grid as a Whole ...... 102 Paging Through Data ...... 103 Chapter 7 – Displaying Data in a Chart ...... 106 The Chart Helper ...... 106 Chart Elements ...... 107 Creating a Chart from Data ...... 108 "Using" Statements and Fully Qualified Names ...... 114 Displaying Charts Inside a Web Page ...... 115 Styling a Chart ...... 116 Saving a Chart ...... 117 Additional Resources ...... 123 Chapter 8 – Working with Files ...... 124 Creating a Text File and Writing Data to It ...... 124 Appending Data to an Existing File ...... 127 Reading and Displaying Data from a File ...... 128 Displaying Data from a Microsoft Excel Comma-Delimited File ...... 131

Deleting Files ...... 131 Letting Users Upload a File ...... 133 Letting Users Upload Multiple Files...... 136 Additional Resources ...... 138 Chapter 9 – Working with Images ...... 139 Adding an Image to a Web Page Dynamically ...... 139 Uploading an Image ...... 142 About GUIDs ...... 144 Resizing an Image ...... 144 Rotating and Flipping an Image ...... 147 Adding a Watermark to an Image ...... 148 Using an Image As a Watermark ...... 149 Chapter 10 – Working with Video ...... 152 Choosing a Video Player ...... 152 MIME Types ...... 153 Playing Flash (.swf) Videos ...... 153 Playing MediaPlayer (.wmv) Videos ...... 156 Playing Silverlight Videos ...... 158 Additional Resources ...... 159 Chapter 11 – Adding Email to Your Website ...... 160 Sending Email Messages from Your Website ...... 160 Sending a File Using Email ...... 164 Additional Resources ...... 166 Chapter 12 – Adding Search to Your Website ...... 167 Searching from Your Website ...... 167 Additional Resources ...... 170 Chapter 13 – Adding Social Networking to Your Web Site ...... 171 Linking Your Website on Social Networking Sites ...... 171 Adding a Twitter Feed ...... 172 Rendering a Gravatar Image...... 174 Displaying an Xbox Gamer Card ...... 175 Displaying a Facebook "Like" Button ...... 176 Chapter 14 – Analyzing Traffic ...... 179 Tracking Visitor Information (Analytics) ...... 179 Chapter 15 – Caching to Improve the Performance of Your Website ...... 183 Caching to Improve Website Responsiveness ...... 183 Chapter 16 – Adding Security and Membership ...... 186 Introduction to Website Membership ...... 186 Creating a Website That Has Registration and Login Pages ...... 187

Creating a Members-Only Page ...... 191 Creating Security for Groups of Users (Roles) ...... 192 Creating a Password-Change Page ...... 194 Letting Users Generate a New Password ...... 196 Preventing Automated Programs from Joining Your Website ...... 200 Chapter 17 – Introduction to Debugging ...... 203 Using the ServerInfo Helper to Display Server Information ...... 203 Embedding Output Expressions to Display Page Values ...... 205 Using the ObjectInfo Helper to Display Object Values ...... 209 Using Debugging Tools ...... 210 Additional Resources ...... 213 Chapter 18 – Customizing Site-Wide Behavior ...... 214 Adding Website Startup Code ...... 214 Running Code Before and After Files in a Folder...... 218 Creating More Readable and Searchable URLs ...... 224 Appendix – ASP.NET Quick API Reference ...... 227 Classes ...... 227 Data ...... 233 Helpers ...... 234 Appendix – ASP.NET Web Pages ...... 241 The Top 8 Programming Tips ...... 241 HTML Encoding ...... 242 A Simple Code Example ...... 248 Visual Basic Language and Syntax ...... 250 Additional Resources ...... 271 Appendix – Programming ASP.NET Web Pages in Visual Studio ...... 272 Why Use Visual Studio? ...... 272 Installing the ASP.NET Razor Tools ...... 272 Using the ASP.NET Razor Tools for Visual Studio ...... 273 Disclaimer ...... 278

Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages

This chapter introduces Microsoft WebMatrix, a free web development technology that delivers the world's best experience for web developers.

What you'll learn

 What is WebMatrix?  How to install WebMatrix.  How to get started creating a simple website using WebMatrix.  How to create a dynamic web page using WebMatrix.  How to program your web pages in Visual Studio to take advantage of more advanced features.

What is WebMatrix Beta?

WebMatrix is a free, lightweight set of web development tools that provides the easiest way to build websites. It includes IIS Express (a development web server), ASP.NET (a web framework), and SQL Server Compact (an embedded database). It also includes a simple tool that streamlines website development and makes it easy to start websites from popular open source apps. The skills and code you develop with WebMatrix transition seamlessly to Visual Studio and SQL Server.

The web pages that you create using WebMatrix can be dynamic—that is, they can alter their content or style based on user input or on other information, such as database information. To program dynamic Web pages, you use ASP.NET with the Razor syntax and with the C# or Visual Basic programming languages.

If you already have programming tools that you like, you can try the WebMatrix tools or you can use your own tools to create websites that use ASP.NET.

This chapter shows you how WebMatrix makes it easy to get started creating websites and dynamic web pages.

Installing WebMatrix Beta

To install WebMatrix, you can use Microsoft’s Web Platform Installer, which is a free application that makes it easy to install and configure web-related technologies.

1. If you don't already have the Web Platform Installer, download it from the following URL:

http://go.microsoft.com/fwlink/?LinkID=205867

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 1

2. Run the Web Platform Installer, select Products, and then click Add to install WebMatrix Beta 3.

Note If you already have WebMatrix Beta 2 installed, the Web Platform Installer upgrades the installation to WebMatrix Beta 3. However, any sites you created with earlier Beta editions may not appear in the My Sites list when you first open WebMatrix Beta 3. To open a previously created site, click the Site From Folder icon, browse to the site, and open it. The next time you open WebMatrix, the site will appear in the My Sites list.

Getting Started with WebMatrix Beta

To begin, you'll create a new website and a simple web page.

1. Start WebMatrix.

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 2

2. Click Site From Template. Templates include prebuilt files and pages for different types of websites.

3. Select Empty Site and name the new site Hello-World. 4. Click OK. WebMatrix creates and opens the new site.

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 3

At the top, you see a Quick Access Toolbar and a ribbon, as in Microsoft Office 2010. At the bottom left, you see the workspace selector, which contains buttons that determine what appears above them in the left pane. On the right is the content pane, which is where you view reports, edit files, and so on. Finally, across the bottom is the notification bar, which shows messages as needed.

Creating a Web Page

1. In WebMatrix, select the Files workspace. This workspace lets you work with files and folders. The left pane shows the file structure of your site.

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 4

2. In the ribbon, click New and then click New File.

WebMatrix displays a list of file types. Most of these are probably familiar, like HTML, CSS, and TXT.

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 5

3. Select CSHTML, and in the Name box, type default.cshtml. A CSHTML page is a special type of page in WebMatrix that can contain the usual contents of a web page, such as HTML and JavaScript code, and that can also contain code for programming web pages. (You'll learn more about CSHTML files later.) 4. Click OK. WebMatrix creates the page and opens it in the editor.

As you can see, this is ordinary HTML markup.

5. Add the following title, heading, and paragraph content to the page:

Hello World Page

Hello World Page

Hello World!

6. In the Quick Access Toolbar, click Save.

7. In the ribbon, click Run.

ASP.NET Web Pages Using The Razor Syntax Chapter 1 – Getting Started with WebMatrix Beta and ASP.NET Web Pages 6