Multifarious Systems 1

1. Multifarious Systems 1 Visual studio 2008 & ASP.NET

2. ASP.NET • Active Server Pages • Web Development Platform • Works on top of the HTTP protocol • Abstract Programming based on the Web Forms Model. • ASP.NET Platform is native part of Microsoft .NET Framework: solutions can be authored with first-class languages (including C#, Microsoft Visual Basic .NET, Microsoft JScript .NET, and J#), and can access the entire hierarchy of classes in the .NET Framework Veton Këpuska

3. ASP.NET Architecture (Courtesy of Bryan Jenks) Veton Këpuska

4. ASP.NET Architecture(Courtesy of Bryan Jenks) Server Side: Client Side: Veton Këpuska

5. ASP.NET Integrates • CSS • HTML • ASP • Code Behind • Business Logic • Themes (New) • MasterPage (New) • Web.config • Database Veton Këpuska

6. Visual Studio 2008 ASP.NET Development in Visual Studio 2008 Veton Këpuska

7. Visual Studio 2008 • Solution – a container that can hold one or more projects. It facilitates grouping of related self-contained applications/functions. • Project – a container that holds all files related to a single ASP.NET (or other) application. • Solution Explorer – a window that one can use to manage files in a project and a solution. Veton Këpuska

8. Creating a New APS.NET Application • Creating a New Web Site: • File  New  Web Site Veton Këpuska

9. Visual Studio 2008 Veton Këpuska

10. Creating a New APS.NET Application • Choose: • ASP.NET Web Site from the list of available templates Veton Këpuska

11. Creating a WebSite Solution Veton Këpuska

12. Creating a New APS.NET Application • Choose: • File System, HTTP, or FTP from locations drop-down list. • File System: • Typically the path to the main folder of the application must be entered: • C:\Users\vkepuska\Documents\Visual Studio 2008\WebSite • HTTP: • Typically if you use same local machine to develop the application the you must configure IIS server by setting up a virtual directory (see chapter on server technologies) • http://localhost/WebSite • FTP: • Must configure your local FTP server to host the site. • ftp://ftp.myhost.com Veton Këpuska

13. Creating a WebSite Solution Veton Këpuska

14. IIS 7.0 Veton Këpuska

15. Creating a New APS.NET Application • Choose: • Choose C# (or VB or Visual J#). Veton Këpuska

16. Default Project Veton Këpuska

17. Simple Calculator Example Veton Këpuska

18. Code (C#) Behind Classes • FileName.aspx.cs • Default.aspx.cs using System; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } } Veton Këpuska

19. Postback, Events and Code-Behind Veton Këpuska

20. Postback – Submit Button • ASP.NET receives the data sent back to the server, including any data the user entered into controls such as text boxes. • ASP.NET determines which page in the application was displayed in the browser window and loads that page into memory on the server. • The properties of any controls that appear on that page are set based on the data entered by the user. • A special variable named IsPostBack is set to True. Enables the application to determine if a postback is occurring. • if (IsPostBack) …. • The code that handles events generated for the page is executed. • After all of the event code has been executed, the page is sent back to the browser in the form of HTML, so the user can see whatever updates have been applied to the page. Veton Këpuska

21. Events • A set of Web pages that contain controls that users can interact with. • Code executed in response to the events generated when the user interacts with the controls on the Web pages. Veton Këpuska

22. Events Series of events that are always raised every time a page is posted • Preinit: First event raised as part of page initialization. It occurs before ASP.NET initializes the page. It is typically used to change the properties of the page to a “default”. • Init: Occurs after ASP.NET has initialized the page; it allows the developer to additionally modify the page. • Load: This event executes after the controls have been initialized with their correct values. • Control Events: Any event that results from the user interacting with controls (e.g., click of a button). • PreRender: This event is raised after all of the control events have been raised but before the HTML that will be send back to the browser is generated. • Unload: This event is raised when the page has been sent back to the browser. Veton Këpuska

23. Event Handlers in C# • The event handling method is specified in aspx file: • <asp:Button ID="ButtonAdd" runat="server" Text="Add" Width="101px“ onclick="Add_Click" /> • Code Added to aspx.cs file: • protected void Add_Click(object sender, EventArgs e) { // Your code here … } Event Handler Method Veton Këpuska

24. C#’s Auto Events • In addition to OnEvent technique, C# uses auto event wireupto automatically call the methods that handle page-level events such as Init and Load. • The following methods are automatically wired: • Page_Init: Wired to the Init method for the page. This method executes after the page is initialized. • Page_Load: This method executes when the page is loaded. • Page_PreRender: This method executes after all control events for the page have been executed and before any HTML has been generated. • Page_Unload: This method typically is used to perform any cleanup taks required by the application – closing files or terminating database connections. Veton Këpuska

25. C#’s Auto Events • Auto-event wireup is controlled by the AutoEventWireup attribute on the Page directive that appears at the top of every .aspx file. • <%@ Page Language="C#" AutoEventWireup="true" CodeFile="~/Default.aspx.cs" Inherits="_Defualt" %> Veton Këpuska

26. Separation of Appearance from Behavior • .aspx and .aspx.cs • Partial Classes and Code Generation • A partial class is a C# class defined by two or more files. The code-behind file is a partial class that supplies the methods that handle events. • The other part of the class is what the .aspx file provides. • Code Generation • .aspx consists of a mizture of HTML and ASP.NET markup tags. • ASP.NET when it processes a page it reads the markup tags and then generates C# code which represents the page, its HTML, and tall its controls. This code is a partial class that matches the partial class represented by the code-behind file. Veton Këpuska

27. Processing of an ASP.NET page • The .aspx file is processed by ASP.NET, which generates a source file that defines a partial class that represents the HTML and controls for the page. • The source file generated in Step 1 is compiled by the C# compiler to create a partial class. • The code-behind file is compiled by the C# compiler to create a partial class. • The partial class created in Steps 2 and 3 are combined to create the complete class that represents the page. • The resuting class is loaded into memory and executed. Veton Këpuska

28. Creating Multiple Applications Veton Këpuska

29. Fundamentals • Adding Pages: • Website  Add New Item • Selected Web Form (usually default) • Enter the name for the page if different then default name. • Select the Programming Language (not a good idea to mix programming languages although it is possible) • Place Code in Separate File option is checked. • Click Add. Veton Këpuska

30. Redirecting to Another Page • Response.Redirect method. It is applied, for example, in the click event handler of a button. • It actually sends a message to the user’s browser, instructing it to post a request for a different page back to the user. • It requires an additional round-trip between the server and the browser. • Example: protected void buttonContinue_Click(object sender, EventArgs e) { Response.Redirect(“Default.aspx”); } Veton Këpuska

31. Redirecting to Another Page • Server.Transfer method. • This method simply transfers the server directly to the other page. • No additional round-trip between the server and the browser is necessary. • Serious limitation – the users browser continues to display the original page in its address bar. • Cross Page Posting. • A button control that automatically posts back to a different page. • Uses PostBackURL attribute of the button to specify the page one wants to post to. <asp:Button ID=“buttonContinoue” runat=“server” Text=“Continue Shopping” PostBackURL=“~Default.aspx” /> Veton Këpuska

32. Adding Classes • Website  Add New Item  Class Veton Këpuska

33. Using Session State • In ASP.NET application once a page is sent to the user’s browser, the program that created the page no longer exists in the server’s memory. • ASP.NET application life: • The user clicks a button or takes some other action that causes a page to be posted to the server. • The server determines which page was posted by the user, locates the program that corresponds to that page, and starts the program. • The program retrieves any data entered by the user, generates HTML for the page, and sends it back to the user. • The generated page is sent back to the user’s browser. • The program ends. • Steps 1-5 define the user’s SESSION. Veton Këpuska

34. Using Session State • A most common way to store the information that specifies the state of an application is by utilizing ASP.NET session state feature. • ASP>NET maintains an object called the Session object for each user who accesses an application. The application however, is responsible to use this object to store and retrieve data between pages. Veton Këpuska

35. Session Object • Session object can be accessed as a property of the Page class. • It maintains collection of data items. • Each item has a name and a value. • The value can be any type of object: • String • Number • Complex object created from a .NET Framework class. • Shopping cart example uses ArrayList class to store the user’s shopping cart information. Example C# code: Veton Këpuska

36. C# Example of Session Object Use // Construction ArrayList cart = new ArrayList(); Session[“cart”] = cart; // Access of an item from the session state ArrayList cart = (ArrayList) Session[“cart”]; // Testing for existence of an item if stored in Session object ArrayList cart; if (Session[“cart”] == null) { cart = new ArrayList(); Session[“cart”] = cart; } else { ArrayList cart = (ArrayList) Session[“cart”]; } Veton Këpuska

37. Important Considerations • ASP.NET automatically keeps track of user sessions. When a user does not post a page after a certain amount of time (typically 20 minutes) the session is closed and any objects stored in session state are deleted. • A single user can have multiple sessions open at the same time. This can happen if the user visits your application using two separate browser windows. ASP.NET keeps the sessions separate. • ASP.NET allows the session state to be stored elsewhere from the server memory: database or special server designated for holding session-state data. Changing were the session-state data is stored does not affect the way you write the code that accesses session state. Veton Këpuska

38. Data Binding • Data binding is a useful technique designed to simplify the taks of getting data out of databases and inot controls that can be displayed on a Web page. • Data binding enables the developer to point a control (e.g. drop-down list, or list box) at a data source (e.g., database or other objects that contain a collection of data items) • Control object automatically extracts specific data from the data source and displays it. • Shopping Cart example application does not use a database but it does data binding with a list box object. • Note shopping cart is stored in an ArrayList object which is a ShoppingCartItem object created by the ShoppingCartItem class. • The Page_Load method contains this code to perform the binding: ArrayList cart = (ArrayList)Session["cart"]; // Retreival of ArrayList from the // Session object lstCart.DataSource = cart; // DataSource property of lstCart object lstCart.DataTextField = "ItemLine"; // DataTextFieldproperto of lstCart is set // to ItemLine the property of the individual // ShoppingCartItem objects that provides the // text to be displayed. lstCart.DataBind(); // DataBind method of the list box is called // to actually bind the data. Veton Këpuska

39. Master Pages • The master page is a single file that defines the template for a set of pages. • A page based on a master is said to be a content page. • One master page can be bound to any number of content pages. • Used to a Web site in which various physical pages share a common layout (defined by Master page). • The master defines the common parts of a certain group of pages and leaves placeholders for customizable regions. • Each content page, in turn, defines what the content of each region has to be for a particular .aspx page. • A content page is a special type of ASP.NET page, as it is allowed to contain only <asp:Content> tags. • Any classic HTML tags—including client-side <script> and comments—are not allowed and, if used, raise compile errors. Veton Këpuska

40. Using Master Pages • ASP.NET Master Pages feature makes it easy to create pages that have a consisted appearance. • Master Page is a template – a page that provides • elements that appear consistently on each page, as well as • content placeholders that specify where the variable content for each page should appear. • ASP.NET does not by default create Master Pages. The following procedure is recommended to start the project with a Master Page: • Delete Defualt.apsx page immediately after starting a new Website. • Create a Master Page you can use for the project • Use the Add New Item command to add a new Defautl.aspx page to the project, selecting the Master Page for the page. • When a Master Page is added to a project, all remaining pages in the project should be content pages rather than regular Web pages. Veton Këpuska

41. Creating a Master Page • Website  Add New Item  Master Page Veton Këpuska

42. Adding Elements To Master Page • Adding a graphic element to the project: • Website  Add Existing Item • Browse to the image/graphics file that one would like to use as a banner: • Click Add • Image/Graphics file is added to the project. • It is desirable for images/graphics to be placed in the self contained folder (e.g., Images). • A folder can be created if it does not exists. • Drag the image file from the Solution Explored window to the Designer window and drop it at the location in the Master Page where you want it to appear. Veton Këpuska

43. Creating a Content Page • Website  Add New Item  Web Form  Check Select Master Page Option Veton Këpuska

44. Creating a Content Page • Select a Master Page: • From the Solution Explorer • Web Designer windowWebsite  Add Content Page <%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Title="Untitled Page" %> <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> </asp:Content> Veton Këpuska

45. Using Client-Side Script Client-side scripting in ASP.NET Veton Këpuska

46. Client-Side Scripting • Example Code at Microsoft.com view source. • Javascript code: <script type="text/javascript" src=“http://i3.microsoft.com/h/all/s/hp.js> </script> Veton Këpuska

47. Tracking Page Views • Client Statistics: • Number of Page Hits • Where visitors come from • What kind of browsers were used • Client-site scripting provides most of that information Veton Këpuska

48. Making Pages Interactive • JavaScript can be embedded as values to some of the atrtibutes in an HTML object. <td class=“gt0” nowraponmouseover=“this.className=‘gt1’” onmouseout=“this.className=‘gt0’”> Veton Këpuska

49. Embedding Script in an ASP.NET Page • A .NET class is dedicated to client script. • ClientScriptManager class • Implemented through ClientScript property of the Page object. • Script code can be part of: • <head> </head> section, or • Dynamically generated by ASP.NET Veton Këpuska

50. Embedding a block of script Veton Këpuska