Developing an ASP.NET Web Application


Published on

Topics Covered
Overview of .NET
Overview of ASP.NET
Creating an ASP.NET Web Form
Adding Event Procedures
Validating User Input

Published in: Technology
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Developing an ASP.NET Web Application

    1. 1. Developing an ASP.NET Web Application <ul><li>Rishi Kothari </li></ul>
    2. 2. Agenda <ul><li>Overview of .NET </li></ul><ul><li>Overview of ASP.NET </li></ul><ul><li>Creating an ASP.NET Web Form </li></ul><ul><li>Adding Event Procedures </li></ul><ul><li>Validating User Input </li></ul>
    3. 3. Overview of .NET
    4. 4. What is the .NET Framework? Developer Tools Clients User Experiences ASP.NET Web Applications XML Web Services Databases .NET Framework
    5. 5. Benefits of .NET <ul><li>Based on Web standards and practices </li></ul><ul><li>Functionality of .NET classes is universally available </li></ul><ul><li>Code is organized into hierarchical namespaces and classes </li></ul><ul><li>Language independent </li></ul><ul><li>Solves existing problems: </li></ul><ul><ul><li>Even with the Internet, most applications and devices have trouble communicating with each other </li></ul></ul><ul><ul><li>Programmers end up writing infrastructure instead of applications </li></ul></ul><ul><ul><li>Programmers have had to limit their scope or continually learn new languages </li></ul></ul>
    6. 6. The .NET Framework Components Win32 Common Language Runtime .NET Framework Class Library ADO.NET and XML XML Web Services User Interface Visual Basic C++ C# ASP.NET Perl Python … Message Queuing COM+ (Transactions, Partitions, Object Pooling) IIS WMI
    7. 7. The Common Language Runtime <ul><li>One runtime for all . NET-Based Languages </li></ul><ul><li>Manages threads and memory </li></ul><ul><ul><li>Garbage collection </li></ul></ul><ul><li>Enforces code security </li></ul><ul><li>Eliminates DLL versioning problems </li></ul><ul><ul><li>Multiple versions of a DLL can run simultaneously </li></ul></ul><ul><ul><li>Applications can specify a version of a DLL to use </li></ul></ul>
    8. 8. Using the Class Library <ul><li>The class library is a set of classes (properties and methods) that all .NET applications can use </li></ul><ul><li>You use objects by referencing the .NET namespaces </li></ul><ul><li>Using a namespace in C#: </li></ul><ul><li>Implicit object declaration </li></ul><ul><li>Explicit object declaration </li></ul>using namespace_name ; using System.Web.UI.WebControls; ListBox ListBox1; ListBox1.Items.Add(&quot;First Item&quot;); System.Web.UI.WebControls.ListBox ListBox1; ListBox1.Items.Add(&quot;First Item&quot;);
    9. 9. Multiple Language Support <ul><li>The .NET Framework is designed to support many languages </li></ul><ul><ul><li>More than 20 languages currently supported </li></ul></ul><ul><ul><li>Microsoft provides Visual Basic .NET, C#, Visual J# .NET, and JScript .NET </li></ul></ul><ul><li>Benefits of multiple-language support </li></ul><ul><ul><li>Code modules are reusable </li></ul></ul><ul><ul><li>Class Library access is the same for all languages </li></ul></ul><ul><ul><li>The right language is used for the right task </li></ul></ul><ul><ul><li>Performance is roughly equal between all languages </li></ul></ul>
    10. 10. Choosing a Language <ul><li>.NET Framework class library is the same regardless of language </li></ul><ul><li>Performance </li></ul><ul><ul><li>All languages are compiled to MSIL </li></ul></ul><ul><ul><li>Only performance difference is how each language compiler compiles to MSIL </li></ul></ul><ul><ul><li>The runtime compiles all MSIL the same, regardless of its origin </li></ul></ul><ul><li>Development experience </li></ul><ul><ul><li>C# is similar to Java, C, Visual C++, and Pascal </li></ul></ul><ul><ul><li>Visual Basic .NET is similar to Visual Basic </li></ul></ul><ul><li>Browser compatibility </li></ul><ul><ul><li>ASP.NET code is server-side code, so browser compatibility is not an issue </li></ul></ul>
    11. 11. Overview of ASP.NET
    12. 12. ASP Web Application Architecture Presentation Tier Business Logic Tier Data Tier UI Pages (.htm) Graphic Files COM Objects Data Source ADO COM+ Services ASP Page (.asp)
    13. 13. ASP.NET Web Application Architecture Presentation Tier Business Logic Tier Data Tier Graphic Files UI Pages (.htm) XML Web Services (.asmx) User Controls (.ascx) Code-Behind File (.aspx.vb or .aspx.cs) Proxy ADO.NET .NET Objects Data Source COM+ Services COM Objects RCW Web Form (.aspx)
    14. 14. ASP.NET Coding Changes <ul><li>Page directives </li></ul><ul><ul><li>Language attribute must be in set the @Page directive </li></ul></ul><ul><li>Structural changes </li></ul><ul><ul><li>All functions and variables must be declared within a <script> block </li></ul></ul><ul><ul><li>Only one language per page </li></ul></ul><ul><ul><li>Render Functions are no longer supported; use Response.Write </li></ul></ul><ul><li>Design-Time controls are no longer supported </li></ul><ul><ul><li>Replaced with Web controls </li></ul></ul>
    15. 15. ASP.NET Runtime Compilation and Execution Native code C# Visual Basic .NET default.aspx Common Language Runtime HTML Which language? Visual Basic .NET compiler C# compiler MSIL JIT compiler
    16. 16. Multimedia: ASP.NET Execution Model
    17. 17. Creating an ASP.NET Web Form
    18. 18. Demonstration: Developing an ASP.NET Web Application <ul><li>Create a Web application </li></ul><ul><li>Add controls to a Web Form </li></ul><ul><li>View the HTML generated </li></ul><ul><li>Add an event procedure </li></ul>
    19. 19. What Is a Web Form? <ul><li>. aspx extension </li></ul><ul><li>Page attributes </li></ul><ul><ul><li>@ Page directive </li></ul></ul><ul><ul><li>Controls save state </li></ul></ul><ul><li>Body attributes </li></ul><ul><li>Form attributes </li></ul><%@ Page Language=&quot;C#&quot; Inherits=Project.WebForm1 %> <html> <body ms_positioning=&quot;GridLayout&quot;> <form id=&quot;Form1&quot; method=&quot;post&quot; runat=&quot;server&quot; > </form> </body> </html>
    20. 20. What is a Server Control? <ul><li>Runat=&quot;server&quot; </li></ul><ul><ul><li>Event procedures run on the server </li></ul></ul><ul><ul><li>View state saved </li></ul></ul><ul><li>Properties and methods are available in server-side event procedures </li></ul><asp:Button id=&quot;Button1&quot; runat=&quot;server&quot; Text=&quot;Submit&quot;/> private void btn_Click(object sender, System.EventArgs e) { lblName.Text = txtName.Text; }
    21. 21. Types of Server Controls <ul><li>HTML server controls </li></ul><ul><ul><li>Based on HTML elements </li></ul></ul><ul><ul><li>Exist within the System.Web.UI.HtmlControls namespace </li></ul></ul><ul><li>Web server controls </li></ul><ul><ul><li>Exist within the System.Web.UI.WebControls namespace </li></ul></ul><ul><ul><li>HTML that is generated by the control </li></ul></ul><input name=&quot;TextBox1&quot; type=&quot;text&quot; value=&quot;Text_to_Display&quot; Id=&quot;TextBox1&quot;/> <asp:TextBox id=&quot;TextBox1&quot; runat=&quot;server&quot;>Text_to_Display </asp:TextBox> <input type=&quot;text&quot; id=&quot;txtName&quot; runat=&quot;server&quot; />
    22. 22. Maintaining the State of ASP.NET Server Controls <ul><li>Server control state is stored in __VIEWSTATE, a hidden control on the Web Form </li></ul><ul><li>__VIEWSTATE stores state in a string value of name-value pairs </li></ul><form id=&quot;Form1&quot; method=&quot;post&quot; runat=&quot;server&quot;> <input type=&quot;hidden&quot; name=&quot;__VIEWSTATE&quot; value=&quot;dDw3NzE0MTExODQ7Oz4=&quot; /> 'HTML here </form> <ul><li>On by default, adjustable at Web Form and control level </li></ul><%@ Page EnableViewState=&quot;False&quot; %> <asp:ListBox id=&quot;ListName&quot; EnableViewState=&quot;true&quot; runat=&quot;server&quot;> </asp:ListBox>
    23. 23. Demonstration: Using Server Controls to a Web Form <ul><li>Using HTML server controls </li></ul><ul><li>Displaying browser-specific HTML </li></ul>
    24. 24. Selecting the Appropriate Control You need specific functionality such as a calendar or ad rotator The control will interact with client and server script You are writing a page that might be used by a variety of browsers You are working with existing HTML pages and want to quickly add ASP.NET Web page functionality You prefer a Visual Basic-like programming model You prefer an HTML-like object model Use Web Server Controls if: Use HTML Server Controls if: Bandwidth is not a problem Bandwidth is limited
    25. 25. Adding Event Procedures
    26. 26. How to Implement Code <ul><li>Three methods for adding code: </li></ul><ul><ul><li>Put code in the same file as content (mixed) </li></ul></ul><ul><ul><li>Put code in a separate <SCRIPT> section of the content file (inline code) </li></ul></ul><ul><ul><li>Put code in a separate file (code-behind pages) </li></ul></ul><ul><li>Code-behind pages are the Visual Studio .NET default </li></ul>Form1.aspx Form1.aspx Form1.aspx.vb or Form1.aspx.cs <tags> <tags> code code Separate files Single file Code-Behind Page
    27. 27. Understanding How Code-Behind Pages Work <ul><li>Create separate files for user interface and interface logic </li></ul><ul><li>Use @ Page directive to link the two files </li></ul>Page1.aspx <% @ Page Language=&quot;C#&quot; Inherits=&quot;Project.WebForm1&quot; Codebehind=&quot;Page1.aspx.cs&quot; Src = &quot;Page1.aspx.cs&quot; %> Page1.aspx.cs namespace Project { public class WebForm1 : System.Web.UI.Page { } }
    28. 28. What are Event Procedures? <ul><li>Action in response to a user’s interaction with the controls on the page </li></ul>
    29. 29. Demonstration: Using Events <ul><li>Open an ASP.NET page with controls and client-side and server-side event procedures </li></ul><ul><li>Click on the controls to view client-side and server-side events running </li></ul><ul><li>In the browser, view the source of the page </li></ul><ul><li>In the editor, view the event procedure code </li></ul>
    30. 30. Client-Side Event Procedures Internet .HTM Pages <ul><li>Typically used only with HTML controls </li></ul><ul><li>Interpreted by the browser and run on the client </li></ul><ul><li>Do not have access to server resources </li></ul><ul><li>Use <SCRIPT language=&quot; language &quot;> </li></ul>
    31. 31. Server-Side Event Procedures <ul><li>Used with both Web and HTML server controls </li></ul><ul><li>Code is compiled and run on the server </li></ul><ul><li>Have access to server resources </li></ul><ul><li>Use <SCRIPT language =&quot;language&quot; runat=&quot;server&quot;> </li></ul>Internet .ASPX Pages
    32. 32. Creating Event Procedures <ul><li>Visual Studio .NET declares variables and creates an event procedure template in the code-behind page </li></ul>protected System.Web.UI.WebControls.Button btn ; private void InitializeComponent() { this. btn.Click += new System.EventHandler(this. btn_Click ); } private void btn_Click (object sender, System.EventArgs e) { }
    33. 33. <ul><li>Events in the Web page generation process </li></ul><ul><li>ASP.NET server control events are handled when the Web page is posted back to the server </li></ul><ul><li>Use the Page.IsPostback property to determine if the Web page is being generated for the first time </li></ul>Events in the Web Page Generation Process private void Page_Load(object sender, System.EventArgs e) { if (!Page.IsPostBack) { // executes only on initial page load } //this code executes on every request } Page_Unload Page_Init Page_Load Server control events
    34. 34. Multimedia
    35. 35. Demonstration: Handling Postback Events
    36. 36. Validating User Input
    37. 37. What Is Input Validation? <ul><li>Verifies that a control value is correctly entered by the user </li></ul><ul><li>Blocks the processing of a page until all controls are valid </li></ul><ul><li>Avoids spoofing or the addition of malicious code </li></ul>
    38. 38. Client-Side and Server-Side Validation <ul><li>ASP.NET can create both client-side and server-side validation </li></ul><ul><li>Client-side validation </li></ul><ul><ul><li>Dependent on browser version </li></ul></ul><ul><ul><li>Instant feedback </li></ul></ul><ul><ul><li>Reduces postback cycles </li></ul></ul><ul><li>Server-side validation </li></ul><ul><ul><li>Repeats all client-side validation </li></ul></ul><ul><ul><li>Can validate against stored data </li></ul></ul>Valid? Valid? User Enters Data No No Yes Yes Error Message Client Server Web Form Processed
    39. 39. ASP.NET Validation Controls Compare to a custom formula CustomValidator Summarize the state of the validation controls on a page ValidationSummary Compare to a regular expression pattern RegularExpressionValidator Compare to a range RangeValidator Compare to another control, a value, or a data type CompareValidator Require user input RequiredFieldValidator Purpose Control Name
    40. 40. Adding Validation Controls to a Web Form <ul><li>Add a validation control </li></ul><ul><li>Select the input control to validate </li></ul><ul><li>Set validation properties </li></ul>1 2 3 <asp:TextBox id=&quot;txtName&quot; runat=&quot;server&quot; /> <asp: Type_of_Validator id=&quot; Validator_id &quot; runat=&quot;server&quot; ControlToValidate=&quot; txtName &quot; ErrorMessage=&quot; Message_for_error_summary &quot; Display=&quot; static|dynamic|none &quot; Text=&quot; Text_to_display_by_input_control &quot;> </asp: Type_of_Validator>
    41. 41. Combining Validation Controls <ul><li>Can have multiple validation controls on a single input control </li></ul><ul><li>Only the RequiredFieldValidator checks empty controls </li></ul>
    42. 42. Demonstration: Using Validation Controls <ul><li>Create an ASP.NET Web Form with TextBox and Button controls </li></ul><ul><li>Add a RequiredFieldValidator control </li></ul><ul><li>Add a RangeValidator control </li></ul><ul><li>Add a RegularExpressionValidator control </li></ul><ul><li>Add a ValidationSummary control </li></ul>
    43. 43. Thanks!