Presentation is loading. Please wait.

Presentation is loading. Please wait.

Day 22, Slide 1 CSE 103 Day 22 Non-students: Please logout by 10:12. Students:

Similar presentations


Presentation on theme: "Day 22, Slide 1 CSE 103 Day 22 Non-students: Please logout by 10:12. Students:"— Presentation transcript:

1 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 1 CSE 103 Day 22 Non-students: Please logout by 10:12. Students: –BTs taken before yesterday are all graded –Take another make-up sometime between Friday April 1 and Tuesday April 5 –Do not ditch class just to go to some silly basketball game(s) and/or riot(s) –Find a partner, get logged in, and start Dreamweaver. Then start reading links from Day 22 classwork page.

2 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 2 Text Reading - HTML Forms What does a form do on a web page? What is a graphical user interface (GUI)? Which TYPE attributes of an INPUT tag can be used in a form? What user interface elements do they create on your page? What other HTML tags can be part of a form?

3 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 3 Review: Parameters via GET Parameters can be passed in a URL Example: http://…/actor.php?ActorID=201101 Same syntax can be used by forms in a GET operation Each parameter becomes a special PHP variable, of the form $_GET['key']=value, where key is the name before = and value is after: –…/actor.php?ActorID=1234 => $_GET['ActorID']=1234 Use curly braces { } if used in query strings –"…WHERE ActorID = {$_GET['ActorID']}…"

4 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 4 Hooking the pages together (I) New CSE 103 support fuction: table_from_query_with_links() –Check the documentation for examples Modify your actor.php file as needed (you need to change two things): –Change your query that lists the movies an actor has been in so that each movie title links to the movie.php page for that movie

5 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 5 Elements Elements Are included in pages inside tags Two important attributes –type=: chooses which UI element to display Options include "text", "hidden", "password", "checkbox", "radio", "button" –name=: the parameter that is assigned the value for this input Controls name of variable in form-processing page (more on this later)

6 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 6 Input Example Type the movie title: Type the movie title: Additional text could be put here. Additional text could be put here. </form> Dreamweaver’s INSERT menu has Form tools –Start by inserting a Form, then Form Elements tag has two attributes (action and method) that we will look at later. Leave defaults in place for now. tag has two attributes (action and method) that we will look at later. Leave defaults in place for now.

7 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 7 Movie Search page Create a new page called find_form.php Put a text box on the page that asks the user for part of a movie title –Create a form first and put the text box in that Leave action and method defaults alone –Submit this text as the parameter movietitle You need an element with name="movietitle" –Add a submit button (inside the form!) labeled Search which activates the form It won't do anything yet; we'll fix that next

8 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 8 Attributes for the tag action attribute –Indicates what script/program will process the data –If just a filename, the file must be in the same directory as the page with the form method attribute is get or post –If the parameters are used only in 1 or more SELECT queries, use get –If the parameters are used in any ACTION queries, use post –If you submit a form using post and if you reload the page, your browser will ask if it's OK to send the data again. Usually you can answer yes.

9 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 9 Create a Form Handler Construct a page findtitle_handler.php to receive the movietitle parameter –Modify find_form.php; set action= and method= for the tag On findtitle_handler.php: –Keys for $_GET match name= from –Keys for $_GET match name= from e.g., => $_GET['movietitle']=whatever you typed in form –Display all movies having movietitle text within their actual titles (show MovieTitle and Year) After this works, continue to next slide

10 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 10 Improving your form handler Once your form handler correctly displays a list of movie titles/years, modify it so that each movie displayed links to movie.php for that movie –Look at how you did this in another page Always think about this when working: Did I do something like this earlier that I could copy / paste and quickly change?

11 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 11 Second Form Exercise Add a SECOND FORM to SAME page find_form.php –Must be a totally separate form so that it can have a different action= attribute This form gets an actor's name from the user (needs its own submit button too) –Use a one-word name= value for the element The new target page findactor_handler.php should display all actors where either their first OR last name matches the input –Valid search: Robert (finds Robert Redford, Julia Roberts) –Invalid search: Robert Redford (first OR last only)

12 http://www.cse.msu.edu/~cse103 http://cse103.egr.msu.edu/user/NETID/page.php Day 22, Slide 12 Homework Finish classwork Make findactor_handler.php and movie.php link to Actor pages Extra practice modifying search results using HTML formatting tags


Download ppt "Day 22, Slide 1 CSE 103 Day 22 Non-students: Please logout by 10:12. Students:"

Similar presentations


Ads by Google