Cs4623advanced web-based app development - complete the


Use session state to store reservation data

In this exercise, you'll store the data that's entered into the Request page of the Reservation application so it can be displayed on a Confirmation page like the one that follows. To make that easier, you'll start from a project that contains the aspx code for the Confirmation page, the class that defines the session state object, and an enhanced Load event handler and a new DisplayReservation method for the Request page.

Review the new form, new class, enhanced Load event handler, and new method

1. Open the XEx08Reservation web site that's in your exercises_extra directory.

1. Display the Confirmation form in Design view so you can see what it looks like.

2. Open the Reservation class in the App_Code directory to see how it's defined. You may even want to print it so you can refer to it as you do this exercise.

3. Review the code for the Load event handler of the Request form. If the page request isn't a postback and a Reservation object is stored in session state (which means that it has already been created), this handler gets the Reservation object from session state and calls the DisplayReservation method that moves the data from the Reservation object to the controls on the Request page. Otherwise, the Load event handler sets the starting values for the arrival date text box and the radio buttons.

4. Review the code in the DispayReservation method to see how it moves the data from the Reservation object to the controls on the form.
Code the Click event handler for the Submit button of the Request form

5. Start a Click event handler for the Submit button of the Request form. It should set the properties of the Reservation object based on the values the user entered on the form. Then, write a statement that saves the Reservation object in session state, and finish with a statement that redirects to the Confirmation page.

6. If you have any trouble writing the statements that convert the control data to properties in the Reservation object, here are some tips.
- To convert a text date to a DateTime object, use the Convert.ToDateTime method.
- To get the number of nights, you can subtract the departure date from the arrival date and then use the Days property of the resulting TimeSpan object.
- To convert a selection in the drop-down list for the number of people to an integer, use the Convert.ToInt32 method.
If you still have trouble, you can skip the conversions that you can't figure out.
Finish the Confirmation form

7. Complete the Load event handler for the Confirmation form. This handler should get the Reservation object that was stored in session state by the Request form and store it in the variable named reservation that's defined at the start of the code-behind file. Then, it should display the properties of that object in the labels on the form by calling a DisplayReservation method.

8. Code the DisplayReservation method. It should get the values from the reservation object and move them to the label controls on the form. But if you skipped any of the properties in step 6 or 7, skip those in this method too.

9. Create a Click event handler for the Confirm Request button on the Confirmation form. It should display a message like the one on the form above.

10. Enhance the aspx code for the Modify Request button on the Confirmation form. It should post back to the Request form.
Test the application

11. Run the application, complete the Request form, and click the Submit button to display the Confirmation page. If the reservation data isn't displayed correctly, fix the problems and test again.

12. Click the Modify Request button to return to the Request form. The data for the reservation should still be displayed so you can modify it and click the Submit button again. When you do that, the Conformation page should show the changed data.

13. Continue testing and fixing until you're sure this application works.

Extra 9-1 Create a master page for the Reservation application

In this application, you'll start by creating a master page for the Reservation application. Then, you'll convert the Request and Confirm pages to content pages. The resulting pages, like the one that follows, should look and operate the same way they did before.

Create the master page

1. Open your solution for either extra exercise 8-1 or 8-2, or open the XEx09Reservation web site in your exercises_extra directory.

2. Add a master page named Site.master to the project. Then, delete the form and div tags but not the placeholder that's in the body of the page.

3. Change the ID for the first placeholder from "head" to "headPlaceHolder", and change the ID for the second placeholder to "formPlaceHolder".

4. Add "Chapter 9: Reservations" as the content of the title element in the head section.

5. Move the link element for the Main.css file on the Request page into the head section of the master page, and move the header and footer elements from the Request page to locations above and below the placeholder in the body of the master page.

6. Enclose the placeholder in the body of the master page within a section element. At this point, the master page should consist of the head element, a header element, a section element that contains the placeholder for the form, and a footer element.
Convert the Request page to a content page

7. Add a MasterPageFile attribute to the Page directive of the Request page that points to the site.master file.

8. Add a Content control to the head element of the page that points to the head placeholder in the master page, move the link element for the Request.css file into this control, and delete any other content.

9. Add a Content control to body of the page that points to the form placeholder in the master page, and move the entire form element into this control.

10. Delete all other elements in the aspx for the page. At this point, there should be a Page directive, one Content control in the head element that contains one link element, and one Content control that contains the entire form for the Request page.
Test the Request page

11. Run the application to see how everything is working. At this point, the Request page should look the way it did before the conversion, with one exception: the drop-down list for the preferred contact method won't be formatted properly. To fix that, add a ClientIDMode attribute to the Master directive of the master page, and set that attribute to "static".

12. If there are any other problems, fix those too.
Convert the Confirm page to a content page and test the entire application

13. Convert the Confirm page to a content page in the same way that you converted the Request page.

14. Test this page and fix any problems.

15. Test the entire application to make sure that it works the same way that it did before.

Extra 11-1 Add site navigation to the Reservation application
In this application, you'll add site navigation to the Reservation application, including the menu and the map path control shown below. To make that easier, you'll start from a web site that contains the extra pages that are needed as well as the web.sitemap file that's used by the navigation controls.

Review the Reservations application

1. Open the XEx11Reservation web site in your exercises_extra directory.

2. Open and review the web.sitemap file. Note that the URL for the Home page is Default.aspx, and note that many of the URLs are set to empty strings. When you click on a menu item with an empty string for its URL, nothing happens. So, when you test this application, focus on the submenu items for the About item.

3. In the Solution Explorer, note that all but one of the pages that have URLs in the web.sitemap file have been added to the project so you won't have to create them. Most of these are just dummy pages that say they're under construction.

4. Open the Site.master file and note that a form element has been added to the file. The form elements have also been removed from the Request.aspx and Confirm.aspx files. This is necessary, because (1) the menu and map path controls need to be in the master file; (2) they need to be within a form element; and (3) a web page can only have one server-side form control.
Add a Menu control to the master page

5. Before the placeholder for the form element on the master page, add a nav element with "mainMenu" as it's ID. The Main.css style sheet has a rule set for this element that provides the spacing and borders before and after the Menu control that you're going to add to this nav element.

6. Add a Menu control to the nav element. Set its Orientation property to Horizontal, and set its StaticEnableDefaultPopOutImage property to False.

7. Add a SiteMapDataSourceControl right after the Menu control, set its ShowStartingNode property to False, and bind it to the Menu control.

8. Run the application to see how the menu looks, drop down the submenus to see how they look, and click on some of the items to navigate to the related pages. Notice the tool tips that are displayed when you point to each item. These come from the description attributes in the web.sitemap file. Then, close the browser.

9. In the Design window, display the smart tag menu for the Menu control and select the Auto Format command. Then, select "Classic" from the list of themes that are displayed and notice how the appearance of the menu changes in the Design window.

10. Run the application again, and note the difference in the way the menus are displayed.

11. At this point, the formatting for the Menu control control could use some improvement. One way to do that is to modify the aspx code that has been generated by the Auto Format command. To illustrate, review the aspx code that has been generated for this control. Next, change the Font-Size attribute to 90% and change the first ForeColor attribute to white. Then, run the application to see the difference.

12. To further improve the formatting for the Menu control, change the HorizontalPadding attribute for the StaticMenuItemStyle attribute to 10px, and change the VerticalPadding attribute for this element to 4px. Then, run the application to see the difference.
Add a SiteMapPath control to the master page

13. Below the nav element for the Menu control but before the placeholder, add a div element with "mapPath" as its ID. The Main.css style sheet has a rule for this element that provides the spacing and indentation for the SiteMapPath control that you're going to add to it. Now, add the SiteMapPath control to this div element.

14. Run the application to see how this control looks on the Home page. Then, use the menu to navigate to other pages in the web site to see how the path changes.

15. Use the menu to go to the Request page, enter the required values, click the Submit button, and notice that the SiteMapPath control isn't displayed on the Confirmation page. That's because this page isn't include in the Web.sitemap file.
Add a TreeView control to a new page

16. Add a new page named Map to the web site, change the attributes in the Content controls so they point to the placeholders in the master page, add a TreeView control to the second Content control on the page, and set its ID to "treeView". The main.css file has a rule set for this element that indents this control and provides spacing after it.

17. Modify the web.sitemap file so it includes a siteMapNode element for this page. This element should be nested within the siteMapNode element for the About Us page.

18. Add a SiteMapDataSource control to the Map page and bind it to the TreeView control.

19. Display the smart tag menu for the TreeView control, select the Auto Format command, and select the "Arrows 2" scheme. Then, run the application, and use the menu to display the Map page. Notice that the node for the Map page in the tree is displayed in a different color, is underlined, and is spaced differently than the other nodes.

20. To change the formatting for the Map page node in the TreeView control, review the aspx code that's been generated for the control and delete the SelectedNodeStyle element. Then, run the application again and note that the node now looks like the other nodes.
Improve the formatting for the navigation controls

21. At this point, you still may not be satisfied with the formatting for the navigation controls. If so, experiment on your own to see if you can get the formatting just the way you want it. You may even want to review the source code for the controls to see if you can use CSS to get the formatting the way you want it. That will demonstrate that getting the formatting right is one of the difficulties of using the navigation controls.

Ex 19-1 Use the Web Site Administration Tool.

In this exercise, you'll add a user account for yourself to the Authentication application that was presented in the book. Then, you'll test this application to see how it works

1. Open the XEx19Authentication application in your exercises_extra directory, convert it to IIS Express, and set the Menu page as the start page.

2. Start the Web Site Administration Tool, display the Security tab, and then click the Create User link.

3. Add an account for yourself, but don't assign yourself to a role. When you're done, close the Web Site Administration Tool.

4. Run the application. When the Menu page is displayed, click the Order a Product link and notice that the Order page can be displayed without logging in.

5. Click your browser's Back button to return to the Menu page. Now, click the Edit My Account link. This time, the Login page is displayed. Log in to see that the My Account page is displayed.

6. Click your browser's Back button twice to return to the Menu page. Then, click the Maintain Data Tables link and log in. This time, nothing happens because you're not authorized to perform maintenance.

7. End the application, and start the Web Site Administration Tool again. Display the Security tab and then click the Manage Users link.

8. Locate your name in the table of users and then click the Edit Roles button. Select the Admin role and then close the Web Site Administration Tool.

9. Run the application again, click the Maintain Data Tables link, and log in. This time, the Maintenance page should be displayed.

10. Continue experimenting if you want to and then end the application.

EX Homemade-1 Create a secured web site which provides page-level and folder-level authorization securities.

a. Refer to our textbook or the note pageLevelAuthorization.pdf for more information, if necessary for this exercise.

b. Visit the website, https://babbage2.se.edu/sp11/winuser/hw04/ex07 , for references, if available.

c. Create a new website using the "ASP.NET Web Forms Site" (not ASP.NET Empty Web Site) option/template for this exercise.

d. Create a StaffOnly.aspx page and make it available over the Menu control. The content of the StaffOnly.aspx page is shown below after a user with a staff or manager role logged in.

e. Create a folder (or directory) called Manager and then add a Default.aspx page under the folder. And make the Default.aspx page available over the Menu control as well. The content of the Default.aspx is shown below after a user with the manager role logged in. [5%].

f. Create the following accounts, roles, authorizations for the new users:

g. Remember to test your applications with different user accounts.
EX Homemade-2 Create a Product Maintenance Master/Details App.

a. Refer to the app on page 499 as an example for this exercise.

b. Please remember to unzip the grocertogoSE.zip and the ImagesGroceries.zip for your database and product images, respectively.
What features do you need to provide:

1 Use the products table in the grocertogoSE.mdb database to create a Master/Details app.
- Remember not to hard-code the path to the database

2 Use a GridView control as the Master control and a DetailsView controller as the Details view control. Refer to the screenshot Fig. 1.

3 Make sure the column headingon the Master control and row headingson the Details control match the ones on screenshot Fig. 2
- column heading: ID, Name, Category
- row headings: Product ID, Name, Short Description, Long Description, Image, Unit Price, Min OnHand, Max OnHand

4 Provide Edit, Delete New features on the Details control (Refer to Fig. 1)

5 Set the Select, Edit, Delete, New as Button style (Refer to Fig. 1)

6 Use "Lilacs in Mist" as the auto-format style for the Master control and use "Classic" as the auto-format for the Details control.

7 Provide the following pagination styles on the Master control
- 10 records or rows /per-page
- Centered the Page number indicators on the footer row

8 Display the product imageon the Details control.
- Display the selected product image (refer to Fig. 3)
- Display the "noImageYet.gif" image if the selected product doesn't have an image yet (Refer to Fig. 4)

9 Display currency format for the unit price (refer to Fig. 1).

10 Make sure the data on the master control and detail control are synchronizedafter you updated, deleted, or added a product (Refer to Fig. 5 and Fig. 6).

Attachment:- HW5.zip

Solution Preview :

Prepared by a verified Expert
DOT NET Programming: Cs4623advanced web-based app development - complete the
Reference No:- TGS02276182

Now Priced at $70 (50% Discount)

Recommended (90%)

Rated (4.3/5)