HTML Forms & PHP. Database Systems CSCI Dr. Tom Hicks Computer Science Department

Size: px

Start display at page:

Download "HTML Forms & PHP. Database Systems CSCI Dr. Tom Hicks Computer Science Department"

Sara Spencer
6 years ago
Views:

1 HTML Forms & PHP Database Systems CSCI-3343 Dr. Tom Hicks Computer Science Department

2 Create Page Faculty-Add.php

3 AddFaculty Page Create page Faculty-Add.php It will be blank for the moment. We are going to use this page as our data collection page. <HTML> <HEAD><TITLE>Faculty Add </TITLE></HEAD> <BODY BGCOLOR = Navy LINK = Yellow VLINK ="#FFFF00" ALINK = Yellow TEXT = White> <CENTER><H1> ADD FACULTY </H1> <H3> Written By Dr. Tom Hicks </H3></CENTER> </BODY></HTML>

4 AddFaculty Page

5 FORM Element

6 FORM HTML forms are used to pass data to a server. An HTML form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements. The form element begins with <FORM> and ends with </FORM> Add the form to the body of the Faculty-Add.php <FORM> </FORM>.

7 GUI s Helpful

8 GUI s Helpful

9 GUI s Helpful

10 FORM METHOD = GET METHOD = GET Cacheable Does not automatically re-request info Should be used only if form is Indepotent Browser will reprocess with no warning Would Re-Bill a credit card with no browser warning May require POST for Indepotent if URL is long For getting/retrieving data only! <FORM METHOD = "GET" > </FORM>.

11 FORM METHOD = POST METHOD = POST Browser will generally reprocess with a warning Don t want credit card rebilled twice I always use with database queries I always want the most recent data Many folks simply use POST all of the time <FORM METHOD = "POST" > </FORM>.

12 FORM METHOD = GET METHOD = GET Get can also expose more of the sensitive information because it is appended to the URL. (See Below!) Security Risk! <FORM METHOD = GET" > I USE POST! </FORM>.

13 FORM ACTION = AddFaculty-Confirmation.php ACTION = Form Process Page URL Relative or Absolute Suppose the data collection page Faculty-Add.php The contents of the form will often be sent to another page for processing; i.e. adding this faculty member record to the database. The data collection page & the process page can be one and the same, but this is often a bit more complex and limiting. I would call the page to add the confirmation page AddFaculty-Confirmation.php It is not the purpose of this presentation to add the record to the database; we are only examining the HTML transfer of information. <FORM METHOD = "POST" ACTION = "AddFaculty-Confirmation.php"> </FORM>.

14 Create Page AddFaculty-Confirmation.php

15 AddFaculty-Confirmation Page Create page AddFaculty-Confirmation.php It will be blank for the moment. We are going to use this page as our data collection page. <HTML> <HEAD><TITLE>Add Faculty Confirmation</TITLE></HEAD> <BODY BGCOLOR = "#800000" LINK = Yellow VLINK ="#FFFF00" ALINK = Yellow TEXT = White> <CENTER><H1> ADD FACULTY CONFIRMATION </H1> <H3> Written By Dr. Tom Hicks </H3></CENTER> </BODY></HTML>

16 AddFaculty-Confirmation Page

17 Form Submission

18 FORM ID = form1 NAME = form1 NAME = form1 ID = form1 HTML offers the ability to logically navigate to named regions on the page. You might choose to automatically move the cursor into one of the form textboxes when a form is loaded you will need the NAME. <FORM METHOD = "POST" ACTION = "Login-Confirmation.php " ID = "form1" NAME = "form1"> </FORM>.

19 INPUT TYPE = SUBMIT NAME = form1 ID = form1 HTML offers the ability to logically navigate to named regions on the page. You might choose to automatically move the cursor into one of the form textboxes when a form is loaded you will need the NAME. <FORM METHOD = "POST" ACTION = "Login-Confirmation.php " ID = "form1" NAME = "form1"> <INPUT TYPE ="submit" VALUE ="Add Faculty Member Now!"> </FORM>.

20 Push The Submit Button

21 Confirmation Page The confirmation page may be a relative address as seen above. The confirmation page may be absolute as shown to google below. <FORM METHOD="POST" ACTION=" <INPUT TYPE ="submit" VALUE = "Go To Google Now"> </form>

22 Text Input Element & PHP Form Processing

23 INPUT TYPE = Text The INPUT element is used for collecting data entered by keyboard. The data may be alpha The data may be numeric Add the code below to your form on Faculty-Add.php First <INPUT NAME = "First" TYPE = "text" SIZE = "15"><P>.

24 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST First < INPUT NAME = "First" TYPE = "text" SIZE = "15"><P> Add the following block of code to the confirmation page. <HR COLOR=PEARL SIZE=6 NOSHADE /> <?PHP $First = $_POST['First']; print "First = ". $First. "<BR>";?>

25 INPUT TYPE = Text The INPUT element is used for collecting data entered by keyboard. The data may be alpha The data may be numeric Add the code below to your form on Faculty-Add.php Age <INPUT NAME = "Age" TYPE = "text" SIZE = " 2"><P>.

26 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST First < INPUT NAME = "First" TYPE = "text" SIZE = "15"><P> Add the following block of code to the confirmation page. <HR COLOR=PEARL SIZE=6 NOSHADE /> <?PHP $Age = $_POST['Age']; print "Age = ". $Age. "<BR>";?>

27 Checkbox Input Element & PHP Form Processing

28 INPUT TYPE = Checkbox The checkbox can be a binary type selection Add the code below to your form on Faculty-Add.php Tenured <INPUT NAME ="Tenured" TYPE ="checkbox"><p>.

Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Tenured <INPUT NAME ="Tenured" TYPE ="checkbox"><p> Add

29 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Tenured <INPUT NAME ="Tenured" TYPE ="checkbox"><p> Add the following block of code to the confirmation page. if(empty($_post['tenured'])) $Tenured = "false"; else $Tenured = "true"; print "Tenured = ". $Tenured. "<BR>";

30 INPUT TYPE = Checkbox There may be more than two responses associated with a checkbox input. Add the code below to your form on Faculty-Add.php Department <INPUT TYPE = "checkbox" NAME = "Department" VALUE = "Computer Science"> Computer Science <INPUT TYPE = "checkbox" NAME = "Department" VALUE = "Mathematics" > Mathematics <P>

Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page.

31 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page. There may be a dozen, or more, choices if necessary. if(empty($_post['department'])) $Department = "None"; else $Department = $_POST['Department']; print "Department = ". $Department. "<BR>";

32 Checkbox Input Element & PHP Form Processing

33 INPUT TYPE = Radio The checkbox can be unary, binary, or more. Add the code below to your form on Faculty-Add.php Rank <INPUT TYPE = "radio" NAME = "Rank" VALUE = "Full Professor" > Full Professor <INPUT TYPE = "radio" NAME = "Rank" VALUE = "Associate Professor" > Associate Professor <INPUT TYPE = "radio" NAME = "Rank" VALUE = "Assistant Professor" > Assistant Professor <P>

34 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page. if(empty($_post['rank'])) $Rank = "None"; else $Rank = $_POST['Rank']; print "Rank = ". $Rank. "<BR>";

35 Select/Combobox Element & PHP Form Processing

36 SELECT Combobox The select combobox is a dropdown control that can be binary, or more. Add the code below to your form on Faculty-Add.php Gender <select name="gender"> <option value="">select Gender</option> <option value="male">male</option> <option value="female">female</option> </select> <P>

37 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page. $Gender = $_POST['Gender']; print "Gender = ". $Gender. "<BR>";

38 Hidden Element & PHP Form Processing

39 INPUT TYPE = Hidden Nothing appears on the page? Add the code below to your form on Faculty-Add.php <INPUT NAME = "Secret" TYPE = "hidden" VALUE="Computer Science Rocks">

40 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page. $Gender = $_POST['Secret']; print "Secret = ". $Secret. "<BR>";

41 Textarea (Multiline) Element & PHP Form Processing

42 SELECT Combobox The select combobox is a dropdown control that can be binary, or more. Add the code below to your form on Faculty-Add.php Comments <BR> <TEXTAREA NAME = "Comments" COLS = "70" ROWS = "7"> Enter your comments here... </TEXTAREA><P>

43 Data To Be Passed!

44 Recover Data Passed To Confirmation Page Data processed in the confirmation can be recovered from &_POST Add the following block of code to the confirmation page. $Comments = $_POST['Comments']; print "Comments = <BR>"; print $Comments. "<P>";

45 PHP Redirect

46 Logical Redirect Every Scripting Language needs some way to logically redirect files to another web page. Suppose we wished to load page localhost/php/displayusers.php if the faculty member is in the Mathematics department. Add the following code to AddFaculty-Confirmation.php in order to make that happen. if ($Department = "Mathematics") header("location:

47 Redirect function I use this redirection on many pages I often abstract it to a function, called Redirect: Return to page Connection.php, used in other PHP Database tutorials. <?php /*============================================================= === Connect To MySQL Database === =============================================================*/ $server ="localhost"; $username="root"; $password="trinity"; $database="libraryth"; $conn = new mysqli(); $conn->connect($server, $username, $password, $database); function Redirect ($URL) { header("location: $URL); }?>

48 Evoking Redirect function Connection.php, used in other PHP Database tutorials. function Redirect ($URL) { header("location: $URL); } Add the following code to AddFaculty-Confirmation.php in order to make that happen. if ($Department = "Mathematics") Redirect("localhost/php/DisplayUsers.php");

49 Disclaimer

50 Recover Data Passed To Confirmation Page None of the forms in this tutorial illustrate how user-friendly forms should be generated. See the tutorial on good form design.

51 Database Systems CSCI 3343 Dr. Thomas E. Hicks Computer Science Department Trinity University 51

HTML Forms & PHP & MySQL Database. Database Systems CSCI-3343 Dr. Tom Hicks Computer Science Department

HTML Forms & PHP & MySQL Database Database Systems CSCI-3343 Dr. Tom Hicks Computer Science Department 1 Import Database University1 with MySQL Workbench 2 It Should Have 3 Tables 3 Create Folders 4 Create