1 / 76

Programming with Microsoft Visual Basic 2008 Fourth Edition

Programming with Microsoft Visual Basic 2008 Fourth Edition. Chapter Twelve Web Applications. Previewing the DJ Tom Application. Web application for DJ (disc jockey) Tom Specializes in weddings

fia
Download Presentation

Programming with Microsoft Visual Basic 2008 Fourth Edition

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Programming with Microsoft Visual Basic 2008 Fourth Edition Chapter Twelve Web Applications

  2. Previewing the DJ Tom Application • Web application for DJ (disc jockey) Tom • Specializes in weddings • Application should allow user to enter bride and groom names, wedding date, email, and name of the first song to be played Programming with Microsoft Visual Basic 2008, Fourth Edition

  3. Previewing the DJ Tom Application (continued) Figure 12-1: Result of clicking the Submit button Programming with Microsoft Visual Basic 2008, Fourth Edition

  4. Lesson A Objectives After studying Lesson A, you should be able to: • Create a Web application • View a Web page in a browser window • Add static text to a Web page • View a Web page in full screen view • Close and open a Web application • Add an image to a Web page • Move a control on a Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  5. Web Applications • Internet: World’s largest computer network • Web pages: Documents that are stored on Web servers • Web server: Computer with special software that “serves up” Web pages requested by client computers • Client computer: Computer that requests information from a Web server Programming with Microsoft Visual Basic 2008, Fourth Edition

  6. Web Applications (continued) • Browser: Program used to request and view information from Web servers • Static Web page: Document that merely displays information to the viewer • Dynamic Web page: Interactive page that can accept information from the user and retrieve information for the user Programming with Microsoft Visual Basic 2008, Fourth Edition

  7. Web Applications (continued) Figure 12-2: Example of a static Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  8. Web Applications (continued) Figure 12-3: Example of a dynamic Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  9. Web Applications (continued) • ASP: Active server page • A technology used to create Web pages • ASP pages contain HTML tags for formatting, for controls included on page, and code for objects to respond to user actions • ASP pages communicate with the Web server to provide data requested by users Programming with Microsoft Visual Basic 2008, Fourth Edition

  10. Web Applications (continued) Figure 12-4: Illustration of the relationship between a client computer and a Web server Programming with Microsoft Visual Basic 2008, Fourth Edition

  11. Creating a Web Application • Visual Web Developer 2008: Used to create Web applications • Available as a standalone product or as part of Visual Studio 2008 • Select File on menu and then click New Web Site • Select File System in Location box • Select Visual Basic in Language box • Select ASP.NET Web Site in Templates • Click OK Programming with Microsoft Visual Basic 2008, Fourth Edition

  12. Creating a Web Application (continued) Figure 12-5: Completed New Web Site dialog box Programming with Microsoft Visual Basic 2008, Fourth Edition

  13. Creating a Web Application (continued) • Click Source tab to display the Source view • Click Design tab to display the Design view • Click Split tab to show both Source and Design view • Display the properties window on the right side of the work area • Adjust the Visual Aids settings: • Click View on menu and then click Visual Aids Programming with Microsoft Visual Basic 2008, Fourth Edition

  14. Creating a Web Application (continued) Figure 12-7: Visual Aids submenu Programming with Microsoft Visual Basic 2008, Fourth Edition

  15. Adding a Title to the Web Page • Title property: Its value appears in the browser’s title bar and on the browser tab • Select Document in the Properties window’s Object box, and then set the Title property value • Start Web application by pressing F5 key • May have to select Modify the Web.config file to enable debugging option Programming with Microsoft Visual Basic 2008, Fourth Edition

  16. Adding a Title to the Web Page (continued) Figure 12-8: Browser window showing the Title property Programming with Microsoft Visual Basic 2008, Fourth Edition

  17. Changing the Background Color of a Web Page • BgColor property: Controls the background color of a Web page • Select Document in Properties window’s Object box, click BgColor property, and then click ellipsis button (…) to display More Colors dialog box • Click on a color in the dialog box then click OK Programming with Microsoft Visual Basic 2008, Fourth Edition

  18. Changing the Background Color of a Web Page (continued) Figure 12-9: More Colors dialog box Programming with Microsoft Visual Basic 2008, Fourth Edition

  19. Adding Static Text to a Web Page • Static text: Text that cannot be changed by the user • Add static text by typing directly inside the rectangle that appears below the <div> tag • Can format the text using the formatting toolbar Programming with Microsoft Visual Basic 2008, Fourth Edition

  20. Adding Static Text to a Web Page (continued) Figure 12-10: Static text entered on the Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  21. Adding Static Text to a Web Page (continued) Figure 12-11: Formatting toolbar Programming with Microsoft Visual Basic 2008, Fourth Edition

  22. Adding Static Text to a Web Page (continued) Figure 12-12: Selected text and alignment choices Programming with Microsoft Visual Basic 2008, Fourth Edition

  23. Viewing a Web Page in Full Screen View • Web page should be previewed in full screen mode to determine how it will appear to the user • Allows you to verify the placement of controls and text on the Web page • Click View on menu and then click Full screen Programming with Microsoft Visual Basic 2008, Fourth Edition

  24. Viewing a Web Page in Full Screen View (continued) Figure 12-13: Web page displayed in full screen view Programming with Microsoft Visual Basic 2008, Fourth Edition

  25. Closing and Opening an Existing Web Application • To close a Web application in Visual Studio 2008: • Click File menu and then click Close Solution • To close a Web application in Visual Web Developer 2008: • Click File menu and then click Close Project • To open an existing web application: • Click File menu and then click Open Web Site Programming with Microsoft Visual Basic 2008, Fourth Edition

  26. Adding an Image to a Web Page • First add the image to the application: • Click the Website menu and then click Add Existing Item • Add an image control to the Web page using the Image tool • In Properties window, click ImageURL, and then click the ellipsis button (…) • Navigate to the image and select it • Can set other properties such as BorderWidth and BorderColor Programming with Microsoft Visual Basic 2008, Fourth Edition

  27. Adding an Image to a Web Page (continued) Figure 12-14: Image control added to the Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  28. Adding an Image to a Web Page (continued) Figure 12-15: Completed Web page displayed in a browser window Programming with Microsoft Visual Basic 2008, Fourth Edition

  29. Repositioning a Control on a Web Page • Click the image control, press left mouse button, and then drag it to the new location Programming with Microsoft Visual Basic 2008, Fourth Edition

  30. Repositioning a Control on a Web Page (continued) Figure 12-17: Modified Web page displayed in a browser window Programming with Microsoft Visual Basic 2008, Fourth Edition

  31. Lesson A Summary • Use the New Web Site command on the File menu to create a Web application • Use Document’s Title property to add a title to a Web page • Use F5 key to start the Web application and display the Web page • Use Document’s BgColor property to set the background color of a Web page • Static text can be entered directly on the web page and formatted in design mode Programming with Microsoft Visual Basic 2008, Fourth Edition

  32. Lesson A Summary (continued) • Use the Full Screen command on the View menu to display the page in full screen view • Use the Close Solution (Visual Studio 2008) command or Close Project (Visual Web Developer 2008) command on the File menu to close a Web application • Use the Open Web Site command on the File menu to open an existing Web application Programming with Microsoft Visual Basic 2008, Fourth Edition

  33. Lesson A Summary (continued) • Use the Add Existing Item command on the Website menu to add an image to the application • Use an image control to display an image • Reposition controls by dragging and dropping Programming with Microsoft Visual Basic 2008, Fourth Edition

  34. Lesson B Objectives After studying Lesson B, you should be able to: • Add a text box, label, and button to a Web page • Code a control on a Web page • Include a RequiredFieldValidator control on a Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  35. Dynamic Web Pages • Dynamic Web page: • Contains controls with which the user can interact • Contains code that tells the controls how to respond to user actions • Plan page layout before adding controls to a Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  36. Dynamic Web Pages (continued) Figure 12-21: Sketch of the Currency Converter application’s Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  37. Dynamic Web Pages (continued) Figure 12-22: Image control and static text on the Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  38. Dynamic Web Pages (continued) Figure 12-23: Additional controls added to the Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  39. Dynamic Web Pages (continued) • To position an image control in relation to the text around it: • Click the Format menu and then click Position • Set the wrapping style, positioning style, location, and size in the Position dialog box Programming with Microsoft Visual Basic 2008, Fourth Edition

  40. Dynamic Web Pages (continued) Figure 12-24: Position dialog box Programming with Microsoft Visual Basic 2008, Fourth Edition

  41. Dynamic Web Pages (continued) Figure 12-25: Size and position of the image control Programming with Microsoft Visual Basic 2008, Fourth Edition

  42. Coding a Control on a Web Page • Currency Converter application’s Submit button must convert American dollars to British pounds • Must add code to the Submit button to accomplish this task • After coding, test the application Programming with Microsoft Visual Basic 2008, Fourth Edition

  43. Coding a Control on a Web Page (continued) Figure 12-27: btnSubmit control’s Click event procedure Programming with Microsoft Visual Basic 2008, Fourth Edition

  44. Coding a Control on a Web Page (continued) Figure 12-28: Result of entering data and clicking the Submit button Programming with Microsoft Visual Basic 2008, Fourth Edition

  45. Validating User Input • Validation section of the toolbox contains tools for validating user input • Validator tools: Each has a purpose and validates a particular type of input • ValidationSummary tool: Used to display all validation error messages in a single location on a Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  46. Validating User Input (continued) Figure 12-29: Listing of validator tools Programming with Microsoft Visual Basic 2008, Fourth Edition

  47. Validating User Input (continued) Figure 12-30: Result of clicking the Submit button before entering any data Programming with Microsoft Visual Basic 2008, Fourth Edition

  48. Lesson B Summary • Use the Position command on the Format menu to wrap text around an image control • Use the Code Editor window to code a control on a Web page • Use validator tools to validate user input on a Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

  49. Lesson C Objectives After studying Lesson C, you should be able to: • Make changes to the Web page in Source view • Create columns using the <div> tag • Utilize an ASP table in a Web page • Add a calendar to a Web page • Add a drop-down list box to a Web page • Create a new line using the <br /> tag Programming with Microsoft Visual Basic 2008, Fourth Edition

  50. Creating the DJ Tom Application • DJ Tom application: • Allows user to enter names of bride and groom, wedding date, email address, and name of first song to be danced • Should provide a Submit button that displays a message on the page, containing the information entered • font-family property: Used to set the font for the Web page • Set in the <body> tag to affect all text on the Web page Programming with Microsoft Visual Basic 2008, Fourth Edition

More Related