Lab 6

pdf

School

Indiana University, Purdue University, Indianapolis *

*We aren’t endorsed by this school

Course

210

Subject

Computer Science

Date

Feb 20, 2024

Type

pdf

Pages

Uploaded by HighnessYakMaster1036

I210 Information Infrastructure I ©Louie Zhu 1 Lab 6: PHP Online Bookstore continued: editing book details For this lab, you will modify the book details pages to allow editing. This lab provides you opportunities to practice passing data between Web pages using forms and query strings. Preview the application at http://www.iupui.edu/~i210 . Browse to Unit 5 > Programming Labs > Lab 6. Click the List Books link and then the The Greater Journey: Americans in Paris title. You will notice the Edit Book button below the book image. Clicking the Edit Book button will open a new page displaying book details in a form. This form allows book details to be editable. Clicking the Update Book button will take you back to the book details page with updated details.

I210 Information Infrastructure I ©Louie Zhu 2 How they work p assing data via a query string greaterjourney.php edit_greaterjourney.php passing data via form The two Web pages pass data to each other. When the Edit Book button is clicked, the greaterjourney.php file passes book details to the edit_greaterjourney.php file using a query string. The edit_greaterjourney.php page then displays the book details in a form so they are editable. When the Update Button in edit_greaterjourney.php is clicked, the form data are sent to the greaterjourney.php file using a post method. The greaterjourney.php file then displays the updated book details. Note: Data are not permanently stored in any external source. Updates may get lost if the browser reloads the greaterjourney.php page. The following table shows the validation rules for all the book attributes. Attribute Required? Data type Title Yes String Author Yes String ISBN Yes String Category Yes String Year Yes Number/integer Pages Yes Number/integer Price Yes Number/float Getting Ready 1. Download the Lab06.zip file from Canvas. Extract it into the htdocs/I210 folder on your computer. The extraction should create a folder named Lab06 . 2. Start PhpStorm and open Lab06/index.html from the I210 project. Run the file to view the application in a browser. Click the List Books link from the navigation bar and then the The Greater Journey link to display the details page. Modifying the greaterjourney.php File 3. Open the greaterjourney.php file in PhpStorm. Modify the HTML comments in the page’s head section to use your name and today’s date. 4. Create a new PHP code block at the very top of the page.

I210 Information Infrastructure I ©Louie Zhu 3 5. Inside the PHP code block, declare seven variables and name them $title, $author, $isbn, $category, $year, $pages, and $price to store book ’s title, author, isbn, category, year, pages, and price, respectively. Initialize these variables with the following default values: a. Title: The Greater Journey: Americans in Paris b. Author: David McCullough c. ISBN: 1416571779 d. Category: History e. Year: 2012 f. Pages: 567 g. Price: $13.95 6. Since this script may receive POST data from the form in edit_greaterjourney.php at runtime, you now need to retrieve the data and sanitize them with filters. Use the filter_has_var function to make sure an input data exists before retrieving it. To retrieve and sanitize the data, use the filter_input function and a sanitize filer based on the data type. The following example shows how to retrieve book title from a textbox named “title” and sanitize it with a filter. //retrieve book title from a textbox named "title" if the variable exists and //then sanitize it. The data type of the book title is a string. if(filter_has_var(INPUT_POST, "title")) { $title = filter_input(INPUT_POST, "title", FILTER_SANITIZE_STRING); } You need to sanitize the book title, author, isbn, category, year, pages, and price and store them in the variables created in the last step. Please note that the book price is a float with two decimals. To sanitize a float in PHP, you will need to use the following flag: FILTER_FLAG_ALLOW_FRACTION. $price = filter_input(INPUT_POST, "price", FILTER_SANITIZE_NUMBER_FLOAT, FILTER_FLAG_ALLOW_FRACTION); 7. Modify all the div tags nested inside the div block with the class named “content” so they display values of PHP variables created in the last two steps. Hint: use the echo statement. 8. Below the div block with the class named “ bookdetail s” , insert a PHP code block. Within the code block, you will need to construct a query string containing the name of the Web page file the data is sent to ( edit_greaterjourney.php ) along with the six variables created in Step 5. Store the query string in a variable named $url . $url ="edit_greaterjourney.php?title=$title ” . “ &author=$author ” . “ &isbn=$isbn ” . “ &category=$category ” . “ &year=$year ” . “ &pages=$pages ” . “ &price=$price ” ;

Your preview ends here

Eager to read complete document? Join bartleby learn and gain access to the full version

Access to all documents
Unlimited textbook solutions
24/7 expert homework help

I210 Information Infrastructure I ©Louie Zhu 4 9. Below the PHP code block, you need to create the Edit Book and the Cancel buttons. In order to send data via a query string, they must function as hyperlinks. This is done via the onclick attribute of the <input> tag. <p> <input type="button" value="Edit Book" onclick="window.location.href='<?= $url ?>'"> <input type="button" value="Cancel" onclick="window.location.href='books.html'"> </p> 10. Save the file. Modifying the edit_greaterjourney.php File 11. Open the edit_greaterjourney.php file in PhpStorm. Modify the PHP comments in the page’s head section to use your name and today’s date. 12. Create a new PHP code block at the very top of the page. 13. Inside the PHP code block, declare seven variables named $title, $author, $isbn, $category $year, $pages, and $price to store book’s title, author, isbn, category, year, pages, and price, respectively. Initialize these variables with empty strings. 14. Since this script may receive query string data from greaterjourney.php at runtime, you now need to retrieve the data and sanitize them with filters. Use the filter_has_var function to make sure an input data exists before retrieving it. To sanitize the data, use the correct sanitize filer based on the data type. The following example shows how to retrieve book title from a query string variable named “title” and then sanitize it with a filter: //retrieve book title from a query string variable named "title" if the variable exists //and then sanitize it. if (filter_has_var(INPUT_GET, "title")) { $title = filter_input(INPUT_GET, "title", FILTER_SANITIZE_STRING); } You need to sanitize the book title, author, isbn, category, year, pages, and price and then store them in the variables created in the last step. Please note again that the book price is a float with two decimals. 15. To enclose the entire div block of book details inside a form, insert the opening <form> tag above the opening <div> tag and the closing </form> tag after the closing </div> tag. 16. Modify the opening <form> tag so the form uses POST method and sends data to the greaterjourney.php file. 17. Modify all the input tags inside the div blocks as follows: a. Set their types based on their data types. b. Use echo statements to set their values to PHP variables created in the Step 13. c. Set their required attribute. d. To allow a float in a number field in HTML 5, use the step attribute. Read more about the step attribute: https://www.w3schools.com/tags/att_input_step.asp .

I210 Information Infrastructure I ©Louie Zhu 5 18. Below the div block of book details and still inside the form, add the Update Book and Cancel buttons. <p> <input type="submit" value="Update Book"/> <input type="button" value="Cancel" onclick="window.location.href='greaterjourney.php'"/> </p> 19. Save the file. Thoroughly test the application. Turning in your lab Your work will be evaluated on completeness and correction. Thoroughly test your code before you turn it in. It is your responsibility to ensure the correct files are turned in. You will NOT receive any credit if you turn in the wrong files whether or not you’ve completed the lab . 1. Zip the entire Lab06 folder and save it as lab06.zip . 2. Upload the lab06.zip file in Canvas before the lab’s deadline. Grading rubric Your TAs will assess your lab according to the following grading rubric. You should very closely follow the instructions in this handout when working on the lab. Small deviations may be fine, but you should avoid large deviations. You will not receive credits if your deviation does not satisfy an item of the grading rubric. Whether a deviation is small or large and whether it satisfies the requirement are at your TAs’ discretion. Here is the breakdown of the scoring: Modifying the greaterjourney.php file (7 points) Activities Points Declare six variables and initialize them with default values (Step 4, 5) 1 Retrieve and sanitize book details from POST data and assign them to variables created in the last steps (Step 6) 3 Modify all the paragraph tags to display values of PHP variables (Step 7) 1 Create the variable named $url (Step 8) 1 Create the two buttons (Step 9) 1 Modifying the edit_greaterjourney.php file (8 points) Activities Points Declare six variables and initialize them with default values (Step 12, 13) 1 Retrieve and sanitize book details from query string variables and assign 3

I210 Information Infrastructure I ©Louie Zhu 6 them to variables created in the last steps (Step 14) Add form tag and attributes (Step 15, 16) 1 Modify all the input tags (Step 17) 2 Create the two buttons (Step 18) 1 Programming styles (5 points) Activities Points Comment your code 3 Use white spaces to separate code sections 1 Indent and line up code 1

Your preview ends here

Eager to read complete document? Join bartleby learn and gain access to the full version

Access to all documents
Unlimited textbook solutions
24/7 expert homework help

Lab 6

Related Documents