We think you have liked this presentation. If you wish to download it, please recommend it to your friends in any social system. Share buttons are a little bit lower. Thank you!
Presentation is loading. Please wait.
Published byTerrance Pope
Modified over 2 years ago
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Chapter 11 Developing Web Applications
Copyright © 2011 Pearson Addison-Wesley Introduction In this chapter you will learn about: – Programming for the World Wide Web – Creating ASP.NET applications – Web server controls and web forms – Using databases in ASP.NET Chapter 11 – Slide 3
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.1 PROGRAMMING FOR THE WEB A Web application runs on a Web server and presents its content to the user across a network, in a Web browser.
Copyright © 2011 Pearson Addison-Wesley HyperText Markup Language HTML stands for HyperText Markup Language – Describes appearance of web pages – A standardized formatting language – It is not a programming language Formatting instructions appear as commands called tags embedded in the web page text – Text following the bold tag ( ) is shown in bold until an end bold tag ( ) appears This text is bold. This text is normal. Web design editors create HTML for you Chapter 11 – Slide 5
Copyright © 2011 Pearson Addison-Wesley ASP.NET The acronym ASP originally stood for Active Server Pages – ASP.NET,the next generation, is a server-side Web programming platform – Provides development tools and visual controls for web browser based applications – Contains Web forms and controls, HTML, and program logic in compiled VB code – VB knowledge transfers directly to ASP.NET VB code runs on the server, not the client – Server runs code that creates an HTML page – Client web browser receives the HTML Chapter 11 – Slide 6
Copyright © 2011 Pearson Addison-Wesley Web Clients and Web Servers The client-server model – A server is a computer that produces data – A client is a computer that uses the data Web applications use the client-server model – Web browsers run on clients and request data from web servers – Web sites are hosted on Web servers that produce data as requested by Web browsers Chapter 11 – Slide 7
Copyright © 2011 Pearson Addison-Wesley Uniform Resource Locator (URL) A URL (Uniform Resource Locator)references a particular web page For example: – Begins with the protocol – Then the domain name pearsonhighered.com – May end with a specific folder path and/or filename The URL is used as an address that uniquely identifies the web page to be retrieved Chapter 11 – Slide 8
Copyright © 2011 Pearson Addison-Wesley Displaying a Web Page What happens when a Web page is displayed by a Web browser? – A computer must be running a Web server, which waits for browser connection requests, this occurs in two steps: 1.Browser connects to server requesting a URL 2.Server translates URL into a physical file located within the server’s file system and sends the requested file, called a Web page, back to the browser – Server breaks connection after sending Web page – Web Browser interprets HTML and renders a Web page – Postback occurs if client requests Web page again By clicking a button control or pressing the Enter key Chapter 11 – Slide 9
Copyright © 2011 Pearson Addison-Wesley Web Forms ASP.NET web pages are called Web forms – A web form Uses a file name extension of.aspx Contains text, HTML tags, and HTML controls Also contains Web server controls such as text boxes, list boxes, and buttons – Also known as ASP.NET Server controls Similar to Windows Forms controls The Program logic for a Web form – is stored in a related code-behind file with extension aspx.vb A Cascading style sheet (CSS) file customizes the appearance of a Web form Chapter 11 – Slide 10
Copyright © 2011 Pearson Addison-Wesley Web Servers Web applications must be run using a Web server – Three choices are available: 1.The ASP.NET Development Server – Installed automatically with Visual Studio 2. Internet Information Services (ISS) – An option with certain versions of Microsoft Windows – Requires careful security configuration 3.A remote Web server – Typically available through an Internet Service Provider (ISP)or a corporate Web server – Must always have an account with a username and password Chapter 11 – Slide 11
Copyright © 2011 Pearson Addison-Wesley HTML Designer and Web Browser Support HTML Designer is a tool in Visual Studio that simplifies the design of Web pages and Web forms – Generates HTML source code and ASP.NET Web controls – Offers the following views of a Web page: A Design view similar to Visual Studio’s forms editor A Source view for direct editing of HTML source code A Split view that displays both views in separate panels There are many different Web browser versions in use – ASP.NET detects and generates version specific HTML – Always test Web applications on other browsers – Chrome, Safari, and Firefox are good choices Chapter 11 – Slide 12
Copyright © 2011 Pearson Addison-Wesley Types of Controls Chapter 11 – Slide 13 GroupDescription StandardCommonly used controls on Web forms DataControls for connecting to and displaying data ValidationControls for validating user input NavigationAdvanced controls for navigating between Web pages LoginControls related to authentication of usernames and passwords WebPartsControls modify content, appearance, and behavior of Web pages AJAX ExtensionsControls that provide rich interface experiences ReportingContains Microsoft Report Viewer for displaying Web-based reports HTMLStandard HTML controls that do not generate user events
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.2 CREATING ASP.NET APPLICATIONS You can use Visual Studio or Visual Web Developer Express Edition to create Web applications in Visual Basic.
Copyright © 2011 Pearson Addison-Wesley Open Web Site Dialog Box Select Open Web Site from the File menu when you want to open an existing Web application Chapter 11 – Slide 15
Copyright © 2011 Pearson Addison-Wesley Types of Web Sites Chapter 11 – Slide 16 A File System Web Site is best suited to a network – Uses ASP.NET Development Server – Supplied with Visual Studio – Simple to use, not open to security attacks Local ISS for a local Web server – Uses Internet Information Services, or IIS – Professional level, extensive security features – Extensive set-up, must have admin rights FTP Site is located on a different machine – Stands for File Transfer Protocol – Usually on the Internet – Provides a way of copying files from one machine to another Remote Site if existing site on remote server – Need userID & password to upload application
Copyright © 2011 Pearson Addison-Wesley Creating a Web Application Click New Web Site from File menu – The New Web Site dialog box appears Chapter 11 – Slide 17
Copyright © 2011 Pearson Addison-Wesley Creating a Web Application The New Web Site dialog box lists possible Web sites templates – Select ASP.NET Empty Web Site from the list Choose a folder for the project – If File System, can choose to use any folder on local computer or network – If HTTP, application will be located on a Web site set up by IIS – If FTP, must use Web site on remote computer When created, an empty Web site contains only one file named Web.config Chapter 11 – Slide 18
Copyright © 2011 Pearson Addison-Wesley Opening an Existing Web Application To open an existing Web application – Select project from Recent Projects window If project doesn’t appear in Recent Projects click – Open: Web Site… link in Recent Projects – Or click Open Web Site on File menu Either of the two previous options display an Open Web Site dialog box – Navigate to folder containing Web site – Click Open Chapter 11 – Slide 19
Copyright © 2011 Pearson Addison-Wesley Running a Web Application Project Can change default browser for your project – Right-click project name in Solution Explorer – Select Browse With... from shortcut menu To run your Web application – Click Run Without Debugging on Debug menu Web forms allow constants called static text – No label control required like a Windows form Chapter 11 – Slide 20
Copyright © 2011 Pearson Addison-Wesley Running a Web Application Project Must configure a project for debug capability – Message box shown when first running a project in debug mode – Clicking OK adds option to Web.config file that enables debugging Tutorial 11-1, you create the Click application Chapter 11 – Slide 21
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.3 WEB SERVER CONTROLS Web Server controls are similar to controls used in Windows applications. You use Web Server controls to make ASP.NET Web applications interactive.
Copyright © 2011 Pearson Addison-Wesley Web Server Controls Overview Make ASP.NET dynamic and interactive Work like HTML controls but far more flexible – Class based with properties, methods, events – Similar to Windows form controls, making it easy for VB programmers to learn Frequently used Web controls: ButtonImageButtonLinkButton LabelRadioButtonRadioButtonList* TextBoxCheckBoxList*ListBox CheckBoxImageCalendar DropDownList * Those noted with asterisk have no Windows form equivalent Chapter 11 – Slide 23
Copyright © 2011 Pearson Addison-Wesley Web Server Controls Overview Web controls properties similar to those of Windows form controls including – Text, Enabled, Visible, Font, ReadOnly, and so on. There are some important differences – Windows control Name property same as the ID property for Web controls – Web controls have an AutoPostBack property – Web controls lose runtime properties when the user moves away from that page – Must save state to retain runtime properties Chapter 11 – Slide 24
Copyright © 2011 Pearson Addison-Wesley How Web Controls Are Processed ASP.NET functions differently from HTML The Web server executes the VB code found behind the ASP.NET Web page When a browser requests an.aspx Web page – Server reads/interprets Web controls on page – VB statements in code-behind file executed – Web page of standard HTML tags and controls built using.aspx Web controls and VB code – HTML Web page sent back to browser Chapter 11 – Slide 25
Copyright © 2011 Pearson Addison-Wesley Label and Text Controls Label control displays data from program – Use only if label text will change at runtime – If text does not change, set up as static text TextBox control holds text input by user – TextMode property can be: SingleLine: permits a single line of input MultiLine: permits multiple lines of input Password: characters typed appear as asterisks – Deal with browser compatibility issues using: Columns property to control TextBox width Rows property to specify entry of multiple lines Chapter 11 – Slide 26
Copyright © 2011 Pearson Addison-Wesley CheckBox Control Functions almost identically to CheckBox in Windows forms – Text property sets text visible to user – Evaluate Checked property at runtime to determine if control checked by user – TextAlign lets you position text Tutorial 11-2 creates a Web sign-up for a Student Picnic application Chapter 11 – Slide 27
Copyright © 2011 Pearson Addison-Wesley Handling Events in Web Forms Events fire differently in Web forms – Page_Load event fires each time a page is displayed instead of just the first time – Page_Load fires before other events such as TextChanged Mouse click on a control with AutoPostBack property set to true sends form back to server – Useful if server should react to a mouse click such as selecting an item from a list box – Occurs automatically for Button, LinkButton, and ImageButton controls Chapter 11 – Slide 28
Copyright © 2011 Pearson Addison-Wesley HyperLink Control Provides a link to navigate to another page – Text property specifies text shown for link – NavigateURL property holds destination URL – Target property determines if a new browser window is opened to display the new page – Set equal to _blank to open a separate window Chapter 11 – Slide 29
Copyright © 2011 Pearson Addison-Wesley ImageButton, LinkButton, and RadioButtonList ImageButton provides a clickable image – Generates a click event – ImageURL property specifies path to image LinkButton behaves like a hyperlink but generates a click event RadioButtonList is a group of radio buttons – Functions similar to a ListBox – Has SelectedIndex & SelectedValue properties Chapter 11 – Slide 30
Copyright © 2011 Pearson Addison-Wesley ListBox Control Very similar to the Windows ListBox control – Has an Items collection – Has the ListBox properties SelectedIndex, SelectedItem, and SelectedValue – SelectionMode property specifies whether multiple list items may be selected SelectedIndexChanged event handling – Must set AutoPostBack to true if this event should fire immediately upon a user selection – If not, event fires only after another control causes form to be posted back to the server Chapter 11 – Slide 31
Copyright © 2011 Pearson Addison-Wesley CheckBoxList and DropDownList CheckBoxList control looks like group of check boxes but works like a ListBox – Has an Items collection – Has the ListBox properties SelectedIndex, SelectedItem, and SelectedValue – Each item has a Boolean Selected property DropDownList similar to ComboBox except: – Initial value of SelectedIndex always zero so the first item is always displayed – Must select item from list, cannot key entry Chapter 11 – Slide 32
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.4 DESIGNING WEB FORMS HTML tables can be used to design a Web application’s user interface. HTML tables provide a convenient way to align the elements of a Web form.
Copyright © 2011 Pearson Addison-Wesley Using Tables to Align Text and Controls Essential tool in Web form design Creates a grid of rows and columns Text and controls placed inside cells of the grid – Permits text and controls to be aligned – Align by right or left justifying each column Blank columns may be used for spacing Click Insert Table in Table menu to show Insert Table dialog box Chapter 11 – Slide 34
Copyright © 2011 Pearson Addison-Wesley Insert Table Dialog Box Example Chapter 11 – Slide 35
Copyright © 2011 Pearson Addison-Wesley Adjusting Row Heights and Column Widths Click and drag to adjust row height or column width Insert rows or columns with Insert on Table menu Can set cell Align property to center, left, or right Adjacent cells can be merged together – Drag mouse over cells to be merged – Select Merge Cells from Layout menu Tutorial 11-3 aligns controls with HTML table Chapter 11 – Slide 36
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.5 APPLICATIONS WITH MULTIPLE WEB PAGES A Web application may use multiple Web pages to display data and interact with the user.
Copyright © 2011 Pearson Addison-Wesley Adding New Web Forms to a Project Two ways to add a new Web form to a project – Select Add New Item from Web Site menu – Right-click project in Solution Explorer and select Add New Item Either displays the Add New Item window – Select Web Form icon – Enter name of page – Be sure Place code in separate file checked Chapter 11 – Slide 38
Copyright © 2011 Pearson Addison-Wesley Adding a Web Form to a Project Chapter 11 – Slide 39
Copyright © 2011 Pearson Addison-Wesley Moving Between Pages To allow the user to move between pages: – Specify URL of target page in NavigateURL property of a HyperLink control – Use Response.Redirect method in click event of a Button, ImageButton, or LinkButton – Use HyperLink button on Formatting toolbar to convert static text into a hyperlink Chapter 11 – Slide 40
Copyright © 2011 Pearson Addison-Wesley Calling Response.Redirect Allows programmer to display another Web page using code in a click event handler Transfer to Web page Page_two.aspx using: Response.Redirect( " Page_two.aspx " ) Complete URL needed to display a page on another server: Response.Redirect("http://microsoft.com") Tutorial 11-4 adds a description form to the Kayak Tour application Chapter 11 – Slide 41
Addison Wesley is an imprint of © 2011 Pearson Addison-Wesley. All rights reserved. Addison Wesley is an imprint of Section 11.6 USING DATABASES ASP.NET provides several Web controls for displaying and updating a database from a Web application.
Copyright © 2011 Pearson Addison-Wesley Web Forms Database Access Web forms database access differs from that used for Windows forms Dataset not used DataSource control used instead Access databases use AccessDataSource control SQL Server databases use SqlDataSource control DataSource controls update database directly No Update method required as with a dataset Chapter 11 – Slide 43
Copyright © 2011 Pearson Addison-Wesley GridView Database Connection Setup Data Source option in GridView Tasks menu allows database connection to be configured – Copy database file to App_Data folder – Select Data Source, use Database – Select database file from the App_Data folder – Configure Select statement for the SQL query – If query requires multiple tables, must create custom SQL using Query Builder – Places a DataSource control on the Web form Tutorial 11-5 configures a GridView control Chapter 11 – Slide 44
Copyright © 2011 Pearson Addison-Wesley Using a DetailView Control to Modify Table Rows Found in Data section of Toolbox window GridView only displays database tables DetailsView can be used to view, edit, delete, or add rows to a database table Connect to data source just as with GridView Allows you to create an effective update program without writing any code Tutorial 11-6 demonstrates how to use the DetailsView control Chapter 11 – Slide 45
Copyright © 2011 Pearson Addison-Wesley SQL Queries Inside the SqlDataSource Control To see how a SqlDataSource is represented in HTML code – Click the Source tab for the Default.aspx page and look for the sqlDataSourceControl – The following code shows the beginning of the code that defines the MembersDataSource from Tutorial 11-6: – A connection string definition: – The DeleteCommand property: – The InsertCommand property: Chapter 11 – Slide 46
Week Developing Web Applications 12. Programming for the Web A Web Application Runs on a Web Server and Presents Its Content to the User Across a Network,
Copyright © 2007 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Slide STARTING OUT WITH Visual Basic 2008 FOURTH EDITION Tony Gaddis.
Chapter 10, Slide 1Starting Out with Visual Basic 3 rd Edition Chapter 11 Developing Web Applications.
Copyright © 2014 Pearson Education, Inc. Chapter 11 Developing Web Applications.
Copyright © 2007 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Slide
Web Programming: Client/Server Applications Server sends the web pages to the client. –built into Visual Studio for development purposes Client displays.
Chapter 27 Getting “Web-ified” (Web Applications) Clearly Visual Basic: Programming with Visual Basic nd Edition.
Tutorial 121 Creating a New Web Forms Page You will find that creating Web Forms is similar to creating traditional Windows applications in Visual Basic.
1 Chapter 12 – Web Applications 12.1 Programming for the Web, Part I 12.2 Programming for the Web, Part II 12.3 Using Databases in Web Programs.
Tutorial: Introduction to ASP.NET Internet Technologies and Web Application 4 th February 2010.
Microsoft Visual Basic 2005 CHAPTER 7 Creating Web Applications.
XP New Perspectives on Microsoft Office Word 2003 Tutorial 7 1 Microsoft Office Word 2003 Tutorial 7 – Collaborating With Others and Creating Web Pages.
XP New Perspectives on Browser and Basics Tutorial 1 1 Browser and Basics Tutorial 1.
Tutorial 7 Creating Forms. Objectives Session 7.1 – Create an HTML form – Insert fields for text – Add labels for form elements – Create radio buttons.
Chapter 12 Working with Forms Principles of Web Design, 4 th Edition.
Database-Driven Web Sites, Second Edition1 Chapter 8 Processing ASP.NET Web Forms and Working With Server Controls.
Macromedia Dreamweaver MX 2004 – Design Professional Dreamweaver GETTING STARTED WITH.
Programming with Microsoft Visual Basic 2012 Chapter 12: Web Applications.
Services Course Windows Live SkyDrive Participant Guide.
1 Chapter 12 Working With Access 2000 on the Internet.
1 Web Technologies Website Development with Dreamweaver.
1. XP 2 * The Web is a collection of files that reside on computers, called Web servers. * Web servers are connected to each other through the Internet.
Chapter 9 Collecting Data with Forms. A form on a web page consists of form objects such as text boxes or radio buttons into which users type information.
1 Data Bound Controls II Chapter Objectives You will be able to Use a Data Source control to get data from a SQL database and make it available.
Office 2003 Introductory Concepts and Techniques M i c r o s o f t Office 2003 Integration Integrating Office 2003 Applications and the World Wide Web.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
8 Chapter Eight Server-side Scripts. 8 Chapter Objectives Create dynamic Web pages that retrieve and display database data using Active Server Pages Process.
Copyright © 2003 Pearson Education, Inc. Slide 7-1 Created by Cheryl M. Hughes The Web Wizards Guide to XML by Cheryl M. Hughes.
Vanderbilt Business Objects Users Group 1 Reporting Techniques & Formatting Beginning & Advanced.
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
HTML, XHTML, and CSS Sixth Edition Chapter 1 Introduction to HTML, XHTML, and CSS.
Chapter 9 Web Applications Copyright © 2011 by The McGraw-Hill Companies, Inc. All Rights Reserved. McGraw-Hill.
Tutorial 1: Browser Basics. Session 1.1 – Understand the Internet and the Web – Customize the Internet Explorer window – Navigate Web pages – Create and.
XP New Perspectives on Microsoft Office Word 2003 Tutorial 3 1 Microsoft Office Word 2003 Tutorial 3 – Creating a Multiple-Page Report.
McGraw-Hill © 2009 The McGraw-Hill Companies, Inc. All rights reserved. Programming with Visual Web Developer Chapter 9.
Microsoft Access 2007 Advanced Level. © Cheltenham Courseware Pty. Ltd. Slide No 2 Forms Customisation.
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
© 2011 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
Whether using paper forms or forms on the web, forms are used for gathering information. User enter information into designated areas, or fields. Forms.
© 2014 by McGraw-Hill Education. This is proprietary material solely for authorized instructor use. Not authorized for sale or distribution in any manner.
© Paradigm Publishing, Inc Excel 2013 Level 2 Unit 2Managing and Integrating Data and the Excel Environment Chapter 6Protecting and Sharing Workbooks.
Guide to Oracle10G1 Introduction To Forms Builder Chapter 5.
Chapter 13 Web Page Design Studio Principles of Web Design, 4 th Edition.
VistA Imaging Capture via Import. 2October 2007 The information in this documentation includes only new and updated functionality of the software after.
Web Center Certification Sitemap / Formatting Content Web Center Certification Training Intuit Financial Services University.
A Guide to Oracle9i1 Introduction To Forms Builder Chapter 5.
© 2017 SlidePlayer.com Inc. All rights reserved.