Data Binding. Basic Data Binding

Transcription

1 Data Binding Instructor: Dr. Wei Ding Fall Basic Data Binding Associate a data source with a control Have that control automatically display your data Key characteristic of data binding is that it is declarative, not programmatic 2

2 Single-Value Binding Bind a control property to a data source The control can display only a single value <%# expression_goes_here %> This expression is entered in the.aspx markup portion of the page (not the code-behind file) and enclosed between the <%# %> delimiters. To evaluate a data binding expression, you must call the Page.DataBind() method in your code. When DataBind() is called, all the expressions on the page are examined and replaced with the corresponding value. 3 SingleValueBinding.aspx and SingleValueBinding.aspx.cs In.aspx file <asp:image runat="server" ImageUrl='<%# FilePath %>' ID="Image1"/> <asp:label runat="server" Text='<%# FilePath %>' ID="Label1"/> In the code behind class Expression refers to a FilePath property protected string FilePath { get { return "apress.gif"; } } Note: Delete <asp:literal ID="Literal1" Runat="server" Text="<%$ RandomNumber:1,6 %> in this example 4

3 SingleValueBinding.aspx and SingleValueBinding.aspx.cs In.aspx file <asp:textbox runat="server" Text='<%# GetFilePath() %>' ID="Textbox1"/> In the code behind class Expression refers to a GetFilePath function protected string GetFilePath() { return "apress.gif"; } Attention: To cause the page to evaluate the expression, you must call the DataBind() method of the containing page: protected void Page_Load(object sender, EventArgs e) { this.databind(); } 5 SingleValueBinding.aspx and SingleValueBinding.aspx.cs <asp:hyperlink runat="server" " NavigateUrl='<%# LogoPath.Value Vl %>' Font-Bold="True" Text="Show logo" ID="Hyperlink1"/> <input type="hidden" runat="server" ID="LogoPath" value="apress apress.gif gif" name="logopath" /> You may also define an hidden object to pass the value. 6

4 Repeated-Value Binding Allows you to bind an entire list of information to a control. ASP.NET includes several basic list controls that support repeat-value binding: All controls that render themselves using the <select> tag, including the HtmlSelect, ListBox, and DropDownList controls The CheckBoxList and RadioButtonList controls, which render each child item with a separate check box or ratio button The BulletedList control, which creates a list of bulleted or numbered points 7 Data Properties for List Controls DataSource DataSourceID DtT DataTextField tfild DataTextFormatString DataValueField 8

5 RepeatedValueBinding.aspx and RepeatedValueBinding.aspx.cs <select runat="server" ID="Select1" size="3" DataTextField="Key" DataValueField="Value name="select1" /> <select runat="server" ID="Select2" DataTextField="Key" DataValueField="Value" name="select2" /> <asp:listbox runat="server" ID="Listbox1" Size="3" DataTextField="Key" DataValueField="Value" /> <asp:dropdownlist p runat="server" ID="DropdownList1" DataTextField="Key" DataValueField="Value" /> <asp:radiobuttonlist runat="server" ID="OptionList1" DataTextField="Key" DataValueField="Value" /> <asp:checkboxlist runat="server" ID="CheckList1" DataTextField="Key" DataValueField="Value" /> 9 protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { // create the data source Hashtable ht = new Hashtable(); ht.add("lasagna", "Key1"); ht.add("spaghetti", "Key2"); ht.add("pizza", "Key3"); For DataTextField // set the controls' DataSource property Select1.DataSource = ht; Select2.DataSource t S = ht; Listbox1.DataSource = ht; DropdownList1.DataSource = ht; CheckList1.DataSource = ht; OptionList1.DataSource = ht; When you call the Page.DataBind() method, the page object calls DataBind() on every contained ti control. For DataValueField ld } } // bind the data to all the control Page.DataBind(); 10

6 Laying Out the Foundations Instructor: Wei Ding The lecture notes are written based on the book Beginning ASP.NET 2.0 E-Commerce in C# 2005 From Novice to Profession by Cristian Darie and Karli Waston, US $44.99, ISBN , Chapter 2 and Chapter 3. Source Code: 11 Revealing the Magic of Three- Layered Architecture Splitting piece of application s functionality into separate components based on what they do, and grouping each kind of component into a single logical tier. The presentation tier The business tier The data tier Presentation Tier Business Tier Data Tier 12

7 Three-Layered Architecture The presentation tier contains the user interface elements of the site, and includes all the logic that manages the interaction between the visitor and the client s business. The business tier (middle tier) receives requests from the presentation tier and returns a result to the presentation tier depending on the business logic it contains. The data tier (database tier) is responsible for storing the application s data, and sending it to the business tier when requested. 13 The rules to follow Three tiers are purely logical there is no constraint on the physical location of each tier. You should make your choice on the particular performance requirements of the application. Information must flow in sequential order between tiers. The presentation tier is only allowed to access the business tier, and never directly the data tier. The business tier is the brain in the middle that t communicate with the other tiers and processes and coordinates all the information flow. 14

8 The code behind page Code-behind file: Allowing the code to be written separately from the static part of the file. The server-side code can be written in the.net language of your choice. Visual Studio creates.aspx.vb code-behind files for VB.NET project,.aspx.cs for C#, and.aspx.js for Jscript.NET. The server-side code of ASP.NET pages if fully compiled and executed, which results in optimal performance and offers the possibility to detect a number of errors at compile-time instead of run time. The concept of code-behind bhid files helps hl separate the visual part of the page from the (server-side) logic behind it. 15 ASP.NET Web Forms ASP.NET web sites are developed around ASP.NET Web Forms. ASP.NET Web Forms have the.aspx extension and are the standard a way to provide web functionality ty to clients. Usually, the.aspx file has an associated code-behind file, which is also considered part of the Web Form. 16

9 Web User Controls Web User Controls (.ascx) and Master Pages (.master): have a structure similar to the structure of Web Forms (They can have codebehind files and so on), but they can t be requested directly by a client web browser. Instead, they are used to compose the content of the Web Forms. Web User Controls (.ascx) can be included in Web Forms, with the parent Web Form becoming the container of the control. Web User Controls allow you to easily reuse pieces of functionality in a number of Web Forms. A Master page pg (.master) is a template that can be applied to a number of Web Forms in a site to ensure a consisten visual appearance and functionality throughout the various pages of the site. 17 Web Server Controls Web Server Controls are compiled.net classes. They generate HTML output (eventually including client-side script) p) when executed. You have learned Label control, TextBox control, etc. You can use Web Server Controls in Web Forms or in Web User Controls. 18

10 Web User Controls, Web Server Controls, and HTML Server Controls Web User Controls, Web Server Controls, and HTML Server Controls are all server-side controls. Web User Controls (.ascx) cannot be requested directly by a client web browser; instead, they are meant to be included in the Web forms or other Web User Controls. HTML Server Controls allow you programmatically access HTML elements of the page from code (scuh as from the code-behind file). You transform an HTML control to an HTML Server Controls by adding the runat= server attribute to it. HTML Server Controls are not as popular as the other two server controls, but sometimes we will use them for quick updates. 19 Master Pages Master Pages are a new feature of ASP.NET 2.0. A Master Page is a template that can be applied to a number of Web Forms in a site to ensure a consistent visual appearance and functionality throughout the various pages of the site. Updating the Master Page has an immediate effect on every Web Form built on top of that t Master Page. 20

11 HTML Server Controls HTML Server Controls: Most HTML Server Controls are doubled by Web Server Controls. In some case, we will use HTML Server Control o to programmatically at access an HTML table cell, which isn t available as a Web Server Control. 21 Microsoft technologies and the three-tier tier architecture Presentation Tier ASP.NET Web Forms ASP.NET Web User Controls ASP.NET Master Pages Business Tier C# classes SQL Server Data Tier SQL Server Stored Procedures Data SQL Server Data Store 22

12 Coding Standard Most companies have their own policies regarding gcoding and naming standards. Your code is already half documented if you following a consistent way of coding. We will following Microsoft s recommendations on naming conventions: A variable name should express what the object does, and not its data type. Check out Microsoft s suggested naming conventions at p y -us/cpgenref/html/cpconnamingguidelines.asp 23 Creating the Visual Studio.NET Project 24

13 IIS vs. Cassini If you have a choice, usually the preferred solution is still to use IIS because of its better performance and because it guarantees that the pages will display the same as the deployed solution. Cassini i (the integrated t web server) does an excellent job of simulating IIS, but it still shouldn t be your first option. 25 Implementing the Site Skeleton List of Departments Here List of Categories Here (for the selected department) Site Header Here Site Contents Here This cell should have different content depending on which page of the site the visitor is browsing. Search Box 26

14 Design Ideas A master Page containing the general structure of all the Web site s s pages, as showed in the last slide. A number of Web Forms that use the Master Page to implement the various locations of the web site, such as the main page, the department page, the search results page, and so on. A number of Web User Controls to simplify reusing specific pieces of functionality (such as the department list box, the categories list box, the search box, the header, and so on.) 27 Implementing a site skeleton Use user controls to create the separate parts of the page. User controls are creates as.ascx files, and include an HTML portion and a source-code portion. Using Visual Studio.NET, the source-code portion of a user control is contained within a separate file as a code-behind class. Continue 28

15 User Controls User controls are ideal for: Repetitive elements on page like headers, menus, login controls, and so on Reducing the amount of code per page by encapsulating those repetitive elements into user controls Improving performance of our pages by making use of the caching functionality available to user controls to cache frequently-viewed data Continue 29 Creating the main web page and Header Web User Control. Step 1. BalloonShop.master and its Web Form: <form id="form1" runat="server"> <table cellspacing="0" cellpadding="0" width="770" border="0"> <tr> <td width="220" valign="top"> List of Departments <br /> List of Categories <br /> </td> <td valign="top"> Header <asp:contentplaceholder ID="contentPlaceHolder" runat="server"> </asp:contentplaceholder> </td> </tr> </table> </form> 30

16 Step 2: Delete Default.aspx. Then add a new Web Form using the master page we just created. Inside the <%@ page > directive, change the following attribute Title="Welcome to BalloonShop!. Step 3: Download the source code from the book website. Copy the \images folder from Chapter02 (complete code)/balloonshop/images to your project s directory BalloonShop/. Save your project and open it again. The /images folder should be included into the project. Step 4: Right click on the root entry and add a New Folder using name UserControls. Right click UserControls and add new Web User Control named as Header.ascx. 31 <p align="center"> <a href="default.aspx"> f "> <img src="images/balloonshoplogo.png" border="0"> </a> </p> Open BalloonShop.master in design view, drag Header.ascx ascx from solution explorer, drop it near the Header text, and then delete the Header text from the cell. 32

17 Building the first page Set As Start Page option: This marks the page as the default Web form that is loaded when browsing to the URL without a file name. The green symbol: for all server-side controls. Visual Studio automatically adds an object declaration in the code-behind file, which will allow you to access the control programmatically. 33 Adding the header to the main page Deploying user controls: Header.ascx cannot run independently. You have to deploy it into an ASPNET ASP.NET Web page. After creating the user control, drag it from the Solution Explorer onto the Design view of the ASP.NET page. This will automatically add the <%@ Register %> directive and the user control's declarative syntax in the HTML portion of the ASP.NET Web page. 34

18 directive directive needs to appear at the top of the ASP.NET Web page's HTML portion and has the following syntax: Register TagPrefix="prefix" TagName="name" Src="path to.ascx file" %> The TagPrefix and TagName values specify how the user control will be referenced declaratively in the Web page's HTML portion. The Src must contain the path to the user control's.ascx file. If the user control resides in the same directory as the ASP.NET Web page, Src can contain just the filename of the.ascx file. 35 Header.ascx Register TagPrefix="uc1" TagName="Header" Src="UserControls/Header.ascx" " %> <uc1:header id="header1" runat="server"></uc1:header> 36

19 Creating a new SQL Server database 1. View Sever Explorer 2. In Server Explorer, right-click the Data Connections entry, and select Create New SQL Server Database. 3. Our server name should be FANTASYLAND\SQLEXPRE SS Or \SQLEXPRESS (at your home computer) 4. Check the option of Use Windows Authentication. 5. Enter Bll BalloonShop for the name CS 437/637 of Database-Backed the new database. Web Sites and Web Services 37 Creating the Product Catalog Part I Instructor: Wei Ding The lecture notes are written based on the book Beginning ASP.NET 2.0 E-Commerce in C# 2005 From Novice to Profession by Cristian Darie and Karli Waston, US $44.99, ISBN , Chapter 2 and Chapter 3. Source Code: 38

20 Database preparation 1. Create the first database table 2. Create a stored procedure 3. Implement data access methods in the middle tier 4. Finally, generate dynamical product catalog online. 39 What does a product catalog look like? Goal: The product catalog should be easily accessible with an easy-to-use interface. Department Category Product 40

21 Planning the departments list of your catalog Presentation Tier ASP.NET Web Forms ASP.NET Web User Controls DepartmentsList.ascx (Web User Control) Business Tier C# classes SQL Server Data Tier SQL Server Stored Procedures Catalog.GetDepartments() (C# code) GetDepartments (stored procedure) Data SQL Server Data Store Department (data table) 41 Install the SQL Express Manager for Easy Access Microsoft SQL Server Management Studio Express, Id=C243A5AE-4BD1-4E3D-94B8-5A0F62BF7796&displaylang=en Log in to your local SQL Server Express Instance (by default, names localhost\sqlexpress) lh le Then you can run SQL scripts using New Query. 42

22 Storing Catalog Information SQL Server is a relational database, which is made up of data tables and the relationships that exist between them. Department table Data from the Department table 43 Terms for a Relational Database Management System (RDBMS) A Primary key is a constraint applied on a table column that guarantees that the column will have unique values across the table. A primary key can be composed of one or more columns. For the latter case, the group of primary key columns (taken as a unit) is guaranteed to be unique. A primary key is not a column itself. It is a constraint that applies to one or more of the existing columns. Data Integrity: Rules and constraints that apply to data tables. RDBMS takes care of its own integrity and makes sure those rules aren t broken. (Continue ) 44

23 Why a separate numerical primary key column? Although a department name can uniquely identify a department record, we prefer to create a separate numerical primary key column other than to use the Name (or another existing column) as the primary key. Because: Performance: The database engine handles sorting and searching operations much faster with numerical values than with strings, especially working with multiple related tables that need to be joined. Department name change: If you need to rely on the ID value being stable in time, creating an artificial key solves the problem, because it s unlikely to change the ID. (Continue ) 45 Terms for a Relational Database Management System (RDBMS) UNIQUE constraint is similar to the Primary Key constraint because it doesn t allow duplicate data. Compared with a Primary Key: Each table only allows ONE Primary Key, but you are allowed to have as many UNIQUE constraints as you like. Another difference is that UNIQUE column can be set to accept NULL values, while the Primary Key column cannot. (Continue ) 46

24 Terms for a Relational Database Management System (RDBMS) Indexes are database objects meant to improve data access performance. Indexes are automatically created on columns with the Primary Key and UNIQUE constraints. Indexes increase the speed of search options, but slow down insert, delete and update operations (why?). Having too many indexes can slow down the database. The general rule is to set indexes on columns for frequently used in WHERE or ORDER BY clauses, used in table joins, or having foreign key relationships with other tables. (Continue ) 47 Terms for a Relational Database Management System (RDBMS) Refer to SQL Server Books Online (the link is posted at class Example Web page). The length property p for different data types means different things. Number of bytes Numerical data types Number of characters text data types Length for int data type is un-configurable. Prefer to use VarChar data type. Text data types are intended to store large fixed-length character data. Unnecessarily using Text data types can slow down the database. (Continue ) 48

25 Terms for a Relational Database Management System (RDBMS) NULL means undefined, which is different from empty value. Identity Columns are auto-numbered columns. SQL Server automatically provides values for it when inserting i new records into the table. By default, the database doesn t permit manually specifying values for identity columns. SQL Server guarantees that the generated values are unique. Identity seed: the first value that SQL Server will provide. Identity increment value: the number of units to increase between two consecutive records. Warning: A value that was generated once will never be generated again, even if you delete rows from the data. (Continue ) 49 Creating the table Department Department (DepartmentID, Name, Description). CREATE TABLE Department( DepartmentID tid INT IDENTITY(1,1) 1) NOT NULL, Name VARCHAR(50) NOT NULL, Description VARCHAR(1000) NULL, CONSTRAINT PK_Department PRIMARY KEY CLUSTERED (DepartmentID ASC) ) 50

26 Implementing the data tier Goal: To get the list of department names from a C# program and populate the user control with that list. Transact-SQL (T-SQL) a language g understood by SQL Server. Stored Procedures are database objects that store programs written in T-SQL. Stored procedures accept input and output parameters and have returned values (much like normal functions). 51 Why not directly passing SQL commands directly to SQL Server? Storing SQL code as a stored procedure usually results in better performance because SQL Server generates and caches the stored procedure execution plan when it is first executed. Using stored procedures allows for better maintainability of the data access code, which can be stored in a central place, and permits easier implementation of the three-tier architecture. Security can be better controlled because SQL Server permits setting different security permissions for each individual stored procedure. The data access code in the business tier looks much better and cleaner when you call the name of a stored procedure than when you join strings to create an SQL query that you finally pass to the database. 52

27 Speaking with the database Structured Query Language (SQL): SELECT, INSERT, UPDATE, DELETE SELECT: retrieve selected data. SELECT <column list> FROM <table name(s)> () [WHERE <restrictive condition>] SELECT Name FROM Department WHERE DepartmentID = 1 (Continue ) 53 Speaking with the database INSERT: add a row of data into the table. INSERT [INTO] <table name> (column list) VALUES (column values) INSERT INTO Department (Name) VALUES ( Mysterious Department ) Return the DepartmentID tid of fthe row just added d (Continue ) 54

28 Speaking with the database UPDATE: modify existing data UPDATE <table name> SET <column name> = <new value> [, <column name> = <new value>] [WHERE <restrictive condition>] UPDATE Department SET NAME= Cool Department WHERE DepartmentID = 43 Without WHERE CS 437/637 Database-Backed clause, the Web change Sites and Web applies Services to all the records 55 (Continue ) Speaking with the database DELETE: remove records from the table DELETE [FROM] <table name> [WHERE <restrictive ti condition>] DELETE FROM Department WHERE DepartmentID = 43 56

29 Creating the stored procedure SQL: SELECT DepartmentID, Name FROM Department Stored Procedure: CREATE PROCEDURE GetDepartments AS SELECT DepartmentID, Name, Description FROM Department RETURN After saving the procedure, the CREATE keyword becomes ALTER. This happens because ALTER is used to change the code of an existing procedure. 57 Implementing the business tier The business tier of the product catalog will consist of a Catalog class written in C#. It will use GetDepartments method to retrieve eve catalog s data from the database ase and send it to the user interface layer. ADO.NET: all.net classes that are related to database access. It can be used from any.net language. 58

30 Accessing SQL Server from C# SQL Server Managed Data Provider is the low-level interface between the database itself and C# program. They are part of ADO.NET objects. System.Data.SqlClient namespace should be imported to access SQL Server. Different database system will provide different data provider classes. 59 Database Operations Each database operation always consists of three steps: 1.Open a connection to the database. 2.Perform the needed operations with the database and get back the results. 3.Close the connection to the database. Golden Rule: Open the connection as late as possible, perform the necessary operations, and then close it immediately. make it as fast as possible 60

31 Connecting to SQL Server SqlConnection, the class used to connect to SQL Server. Imports System.Data.SqlClient make you no longer to type the fully qualified name for classes in that namespace, such as System.Data.SqlClient.SqlConnection // Create the connection object SqlConnection connection = new SqlConnection(); // Set the connection string Connection.ConnectionString= connection string here ; // Open the connection connection.open() 61 Connection String When creating a new database connection,,you always need to specify at least three important pieces of data: 1. The name of the SQL Server instance you re connecting to 2. The authentication information that will permit you to access the server 3. The database you want to work with SqlConnection connection = new SqlConnection(); Connection.ConnectionString= ConnectionString= Server=(local)\SqlExpress Server=(local)\SqlExpress + User ID=johnny; Password=qwerty; + & Database=BalloonShop ; connection.open() 62

32 SQL Server Security SQL Server Authentication: You supply a SQL Server username and password. Showed in the example of the previous slide. Windows Authentication (Windows Integrated Security): SQL Server uses the Windows login information of the currently logged in user. You need to supply Integrated Security=True instead of User ID=username, Password=password. 63 Using Windows Authentication mode When using Windows Authentication, ASP.NET applications connect to SQL Server under the credentials of a special account named ASPNET. You need manually add ASPNET account to SQL Server. 64

33 Configure the connectionstrings Web.config and connectionstrings <configuration xmlns=" <connectionstrings> <add name="balloonshopconnection" connectionstring="server=(local)\sqlexpress;integrated Security=True;Database=BalloonShop" providername="system.data.sqlclient"/> <connectionstrings> <system.web> </system.web> </configuration> Notice that you should type the <add> element on a single line, not split in multiple lines as shown in the slide. 65 Implementing Generic Data Access Code using System.Data.Common; provide generic data access functionality (they weren t available in ADO.NET 1.0 or 1.1), such as DBConnection, DbCommand. The first step in implementing database-agnostic data access is to use the DbProviderFactory class to create a new database provider factory object. // Create a new data provider factory DbProviderFactory factory = DbProviderFactories.GetFactory(dataProviderName); So where do we obtain the data provider name? 66

34 Discussion In practice, the System.Data.SqlClient SqlClient string parameter is kept in a configuration file, allowing you to have C# code that really doesn t know what kind of database ase it s dealing with. 67 Connection object The database provider factory class is capable of creating a database-specific specific connection object through its CreateConnection object. However, you will keep the reference to the connection object stored using the generic DbConnection reference. // Obtain a database specific connection object DbConnection conn = factory.createconnection(); // Set the connection string conn.connectionstring = connectionstring; Where do you obtain the connection string? 68

35 Sql command The connection object has a method named creatcommand that returns a database command object, but you ll keep the reference e e stored using a database-neutral ase eut a object: DbCommand. // Create a database specific command object DbCommand comm = conn.createcommand(); C // Set the command type to stored procedure comm.commandtype = CommandType.StoredProcedure; // Return the initialized command object 69 Static class members Static properties and static methods can be called by external classes without creating an instance of the class first; Instead, they can be called directly using the class various operations, such as Math.Cos, and so on. Under the hood, the static class members are called on a global instance of that class, which is not destroyed by the Garbage Collector after execution. So the values of any static members are persisted. A static class member can call or access another static class member directly. 70

36 CatalogAccess.cs public static class CatalogAccess {}.The class to use static members mainly to improve performance. Static classes and static members are initialized only once, they don t need to be reinstantiated each time a new visitor makes a new requewst; instead, a global instances are used. 71 CatalogAccess.cs uses GenericDataAccess.cs public static class CatalogAccess { // Retrieve the list of departments public static DataTable GetDepartments() { // get a configured DbCommand object DbCommand comm = GenericDataAccess.CreateCommand(); // set the stored procedure name comm.commandtext = "GetDepartments"; // execute the stored procedure and return the results return GenericDataAccess.ExecuteSelectCommand(comm); } } 72

37 Data provider connection string command GenericDataAccess.cs uses BalloonShopConfiguration.cs Class: GenericDataAccess.cs public static DbCommand CreateCommand() { // Obtain the database provider name string dataprovidername = BalloonShopConfiguration.DbProviderName; // Obtain the database connection string string connectionstring = BalloonShopConfiguration.DbConnectionString; // Create a new data provider factory DbProviderFactory factory = DbProviderFactories.GetFactory(dataProviderName); // Obtain a database specific connection object DbConnection conn = factory.createconnection(); // Set the connection string conn.connectionstring = connectionstring; // Create a database specific command object DbCommand comm = conn.createcommand(); // Set the command type to stored procedure comm.commandtype = CommandType.StoredProcedure; // Return the initialized command object return CS 437/637 comm; Database-Backed Web Sites and Web Services 73 } Class: GenericDataAccess.cs // execute a command and returns the results as a DataTable object public static DataTable ExecuteSelectCommand(DbCommand command) { // The DataTable to be returned DataTable table; // Execute the command making sure the connection gets closed in the end try { // Open the data connection command.connection.open(); // Execute the command and save the results in a DataTable DbDataReader reader = command.executereader(); table = new DataTable(); table.load(reader); // Close the reader reader.close(); } catch (Exception ex) { Utilities.SendErrorLog (ex); throw ex; } finally { // Close the connection command.connection.close(); } return table; } GenericDataAccess.cs uses Utilities.cs Send an to the administrator and move on The finally block is always executed whether an exception occurs 74 or not

38 BalloonShopConfiguration.cs The BalloonShopConfiguration class is simply a collection of static properties that return data from web.config. Using this class instead of needing to read web.config all the time is better. Because the class can cache the values read from web.config instead of reading them on every request. 75 Sending s Add necessary configuration data under the <appsettings> node in web.config. <configuration xmlns=" <appsettings> <add key="mailserver" value="localhost" /> <add key="enableerrorlog " value="true" /> <add key="errorlog " value="errors@yourballoonshopxyz.com" /> </appsettings> </configuration> 76

39 Utilities.cs using System.Net.Mail; the namespace includes SmtpClient and MailMessage classes to help you send s. // Generic method for sending s public static void SendMail(string from, string to, string subject, string body) { // Configure mail client (may need additional // code for authenticated SMTP servers) SmtpClient mailclient = new SmtpClient(BalloonShopConfiguration.MailServer); // Create the mail message MailMessage mailmessage = new MailMessage(from, to, subject, body); // Send mail mailclient.send(mailmessage); } 77 SMTP Server To work with your local SMTP server,,you need ensure that the server is started using the IIS Configuration console (check the handouts distributed by the instructor in class). You also need to enable replaying for the local machine. IIS configuration console expand your computer s node rightclick Default SMTP Virtual Server select properties go to the Access tab click the Relay button add to the list finally restart the SMTP server. for help. 78

40 DepartmentsList.ascx // Load department details into the DataList protected void Page_Load(object sender, EventArgs e) { // CatalogAccess.GetDepartments returns a DataTable object containing // department data, which is read in the ItemTemplate of the DataList list.datasource = CatalogAccess.GetDepartments(); // Needed to bind the data bound controls to the data source list.databind(); } 79 Creating the Product Catalog Part I Presentation Tier Instructor: Wei Ding The lecture notes are written based on the book Beginning ASP.NET 2.0 E-Commerce in C# 2005 From Novice to Profession by Cristian Darie and Karli Waston, US $44.99, ISBN , Chapter 2 and Chapter 3. Source Code:

41 What To Be Displayed 81 Displaying the List of Departments BalloonShopDefault, a theme folder BalloonShop.css Web.Config: <system.web> <pages theme="balloonshopdefault"/> </system.web> 82

42 Use Style Builder with BalloonShop.css While.css file is open in edit mode, right-click one of its styles, and click the Build Style menu option. 83 Displaying the List of Departments -- DepartmentsList.ascx CssClass.DepartmentListContent { border-right: right: #01a647 1px solid; border-top: #01a647 1px solid; border-left: #01a647 1px solid; border-bottom: #01a647 1px solid; background-color: #9fe1bb; text-align: center; } HeadStyle-CssClass.DepartmentListHead { border-right: #01a647 1px solid; border-top: #01a647 1px solid; border-left: #01a647 1px solid; border-bottom: #01a647 1px solid; background-color: #30b86e; font-family: Verdana, Arial; font-weight: bold; font-size: 10pt; color: #f5f5dc; padding-left: 3px; text-align: t center; } a.departmentunselected { } a.departmentunselected:hover { } a.departmentselected { } 84

43 Setting the DataList Properties Edit Template Header and Footer Templates 85 Edit Template Item Templates <asp:hyperlink ID="HyperLink1" Runat="server" NavigateUrl='<%# "../Catalog.aspx?DepartmentID=" + Eval("DepartmentID")%>' Text='<%# Eval("Name") ") %>' ToolTip='<%# Eval("Description") %>' CssClass='<%# Eval("DepartmentID").ToString() == Request.QueryString["DepartmentID"] est er? "DepartmentSelected" : "DepartmentUnselected" %>'> </asp:hyperlink> ALTER PROCEDURE GetDepartments AS SELECT DepartmentID, Name, Description FROM Department <%# Eval( Name ) %> returns the Name field of the row being processed in the DataList The Ternary operator if (condition) return value1 else return value2; 86

44 Adding a Custom Error Page Add a custom error page to your site that your visitor will see in case an unhandled error happens. That page will politely ask the visitor to come back later Report the error once again, so the administrator knows that t this serious error gets to the visitor it and needs to be taken care of as soon as possible. 87 Adding a Custom Error Page Global.asax void Application_Error(Object sender, EventArgs e) { // Log ass unhandled errors Utilities.LogError(Server.GetLastError()); } Oooops.aspx a customized error page Web.Config <customerrors mode= on" defaultredirect="oooops.aspx" /> 88