COM336 – Web Database Development XHTML & Forms. PHP and the WWW PHP and HTML forms – Forms are the main way users can interact with your PHP scrip Typical.

Slides:



Advertisements
Similar presentations
HTML Forms. collect information for passing to server- side processes built up from standard widgets –text-input, radio buttons, check boxes, option lists,
Advertisements

23-Aug-14 HTML/XHTML Forms. 2 What are forms? is just another kind of XHTML/HTML tag Forms are used to create (rather primitive) GUIs on Web pages Usually.
24-Aug-14 HTML Forms. 2 What are forms? is just another kind of HTML tag HTML forms are used to create (rather primitive) GUIs on Web pages Usually the.
The Web Warrior Guide to Web Design Technologies
Lecture 14 HTML Forms CPE 401 / 601 Computer Network Systems slides are modified from Dave Hollinger.
Chapter 6 Basic forms 1. Forms and query string 2 form : a group of user input (UI) controls that accepts information from the user and sends the information.
Form Basics CS Web Data  Most interesting web pages revolve around data  examples: Google, IMDB, Digg, Facebook, YouTube, Rotten Tomatoes  can.
USER INTERACTIONS: FORMS
ECA 228 Internet/Intranet Design I Forms. ECA 228 Internet/Intranet Design I Forms forms are a way for a user to communicate with you – text fields –
Chapter 10 Form Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Form Handling, Validation and Functions. Form Handling Forms are a graphical user interfaces (GUIs) that enables the interaction between users and servers.
CST JavaScript Validating Form Data with JavaScript.
Chapter 9 Collecting Data with Forms. A form on a web page consists of form objects such as text boxes or radio buttons into which users type information.
1 Web Developer & Design Foundations with XHTML Chapter 6 Key Concepts.
Client-Side programming with JavaScript 3
MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value.
PHP Tutorials 02 Olarik Surinta Management Information System Faculty of Informatics.
Advance Database Management Systems Lab no. 5 PHP Web Pages.
Web forms in PHP Forms Recap  Way of allowing user interaction  Allows users to input data that can then be processed by a program / stored in a back-end.
Introduction to PHP and Server Side Technology. Slide 2 PHP History Created in 1995 PHP 5.0 is the current version It’s been around since 2004.
Reading Data in Web Pages tMyn1 Reading Data in Web Pages A very common application of PHP is to have an HTML form gather information from a website's.
4-Sep-15 HTML Forms Mrs. Goins Web Design Class. Parts of a Web Form A Form is an area that can contain Form Control/Elements. Each piece of information.
PHP Forms and User Input The PHP $_GET and $_POST variables are used to retrieve information from forms, like user input.
INTERNET APPLICATION DEVELOPMENT For More visit:
Lecture 6 – Form processing (Part 1) SFDV3011 – Advanced Web Development 1.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Chapter 6: Forms JavaScript - Introductory. Previewing the Product Registration Form.
XHTML Introductory1 Forms Chapter 7. XHTML Introductory2 Objectives In this chapter, you will: Study elements Learn about input fields Use the element.
Robinson_CIS_285_2005 HTML FORMS CIS 285 Winter_2005 Instructor: Mary Robinson.
CSC 2720 Building Web Applications HTML Forms. Introduction  HTML forms are used to collect user input.  The collected input is typically sent to a.
JavaScript, Fourth Edition Chapter 5 Validating Form Data with JavaScript.
Chapter 8 Collecting Data with Forms. Chapter 8 Lessons Introduction 1.Plan and create a form 2.Edit and format a form 3.Work with form objects 4.Test.
Website Development with PHP and MySQL Saving Data.
 Whether using paper forms or forms on the web, forms are used for gathering information. User enter information into designated areas, or fields. Forms.
HTML Forms.
LOGO FORMs in HTML CHAPTER 5 Eastern Mediterranean University School of Computing and Technology Department of Information Technology ITEC229 Client-Side.
1 © Netskills Quality Internet Training, University of Newcastle HTML Forms © Netskills, Quality Internet Training, University of Newcastle Netskills is.
Week 9 - Form Basics Key Concepts 1. 1.Describe common uses of forms on web pages 2.Create forms on web pages using the form, input, textarea, and select.
76 © 1998, 1999, 2000 David T. Gray, Howard Duncan, Jane Kernan Frames When displaying information in a browser, it is sometimes useful to divide the display.
ITCS373: Internet Technology Lecture 5: More HTML.
CSC 2720 Building Web Applications Server-side Scripting with PHP.
HTML FORMS GET/POST METHODS. HTML FORMS HTML Forms HTML forms are used to pass data to a server. A form can contain input elements like text fields, checkboxes,
XHTML & Forms. PHP and the WWW PHP and HTML forms – Forms are the main way users can interact with your PHP scrip Typical usage of the form tag in HTML.
Chapter 2: Variables, Functions, Objects, and Events JavaScript - Introductory.
Forms Collecting Data CSS Class 5. Forms Create a form Add text box Add labels Add check boxes and radio buttons Build a drop-down list Group drop-down.
Web Page Design Forms! Website Design. Objectives What forms can do The Attributes of the form tag Using Textboxes Textareas Checkboxes Radio buttons.
©SoftMooreSlide 1 Introduction to HTML: Forms ©SoftMooreSlide 2 Forms Forms provide a simple mechanism for collecting user data and submitting it to.
8 Chapter Eight Server-side Scripts. 8 Chapter Objectives Create dynamic Web pages that retrieve and display database data using Active Server Pages Process.
Netprog CGI and Forms1 CGI and Forms A detailed look at HTML forms.
HTML Forms.
HTML Forms. A form is simply an area that can contain form fields. Form fields are objects that allow the visitor to enter information - for example text.
Since you’ll need a place for the user to enter a search query. Every form must have these basic components: – The submission type defined with the method.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Project 6: Creating XHTML Forms Kelly.
1 HTML forms (cont.)
Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
INTERNET APPLICATIONS CPIT405 Forms, Internal links, meta tags, search engine friendly websites.
CGS 3066: Web Programming and Design Spring 2016 PHP.
Lesson 5 Introduction to HTML Forms. Lesson 5 Forms A form is an area that can contain form elements. Form elements are elements that allow the user to.
HTML Structure II (Form) WEEK 2.2. Contents Table Form.
Unit 4 Working with data. Form Element HTML forms are used to pass data to a server. A form can contain input elements like text fields, checkboxes, radio-buttons,
FORMS Explained By: Jasdeep Kaur. Lecturer, Department of Computer Application, PGG.C.G., Sector: 42, Chandigarh.
Ashima Wadhwa Java Script And Forms. Introduction Forms: –One of the most common Web page elements used with JavaScript –Typical forms you may encounter.
2440: 141 Web Site Administration Web Forms Instructor: Joseph Nattey.
Chapter 5 Validating Form Data with JavaScript
Introducing Forms.
Forms, cont’d.
Creating Forms on a Web Page
PHP-II.
Presentation transcript:

COM336 – Web Database Development XHTML & Forms

PHP and the WWW PHP and HTML forms – Forms are the main way users can interact with your PHP scrip Typical usage of the form tag in HTML – id is optional (but encouraged in XHTML) action is mandatory. The value is the URL (or name of the file, if in current directory) where the data collected by the form is to be sent method can take one of two values: get and post 2

HTML forms HTML forms (a way of getting input from the browser) include form elements such as: – text areas – password areas – check boxes – selection lists – scrolled selection lists – radio buttons – submit button – reset button – picture buttons 3

An HTML form 4

5

Using method=“get” This method appends the form-data to the URL in name/value pairs This method is useful for form submissions where a user want to bookmark the result (think google search) There is a limit to how much data you can place in a URL (varies between browsers), therefore, you cannot be sure that all of the form-data will be correctly transferred Never use the "get" method to pass sensitive information! (password or other sensitive information will be visible in the browser's address bar) 6

Using method=“post” This method sends the form-data as an HTTP post transaction Form submissions with the "post" method cannot be bookmarked (think login forms or member only areas) The "post" method is more robust and secure than "get", and "post" does not have size limitations 7

PHP Superglobals $_GET $_POST Works in the same way as $_GET – $_POST is an associative array – The keys to the array are the same as the field names in your form – Data sent via post is not exposed to the browser. The transaction is handled internally by the webserver 8

HTML form tags - overview 9

Starting and ending forms - tag HTML forms are created by using the HTML and tags Within these tags, you place various HTML form elements, such as text areas, check boxes, and radio buttons..  ---(Your FORM elements here). 10

Form arguments The tag has two primary arguments: action - Specifies the URL of the PHP script to start when the form is submitted method - Defines the format that will be used to send data to the PHP script – get appends the form arguments to the end of the Web address (as a Query String after the “?”) – post sends the data as part of the body of the HTTP Request 11

The tag Used to define a range of form elements, designated by its TYPE attribute. The general format of the tag is: – type = submit | reset | text | checkbox | radio| etc. – name: will be used by the CGI program to identify the form element (i.e. the CGI variable) – value: the value to be associated with “name” when processing the form (The tag has NO closing tag ) 12

The tag - Form buttons Used to submit the form or erase all input When the submit button is clicked, the form data is sent to the program specified in the ACTION argument, and the CGI program executed If form consists only of a submit button, the CGI program is simply executed 13

tag - Text box The text input type creates text boxes on forms 14 text area box size max. characters allowed CGI variable name

tag - Text box 15

Text areas - tag 16 u Enables the user to enter multiple lines of text Please enter comments here u The wrap attribute specifies what to do if the user types beyond the right margin of the text area If omitted, wrapping is not enabled If wrap=“virtual”, wrapping is enabled but the text is submitted without linebreaks If wrap=“physical”, line breaks are submitted as part of the text CGI variable name default text value

tag - Checkboxes 17 Copyright © 2002 Pearson Education, Inc.

tag - Checkboxes Small boxes on a form that create a check mark when the user clicks them USA China The user may select (tick) multiple boxes 18 CGI variable name CGI variable value when clicked label displayed next to checkbox

tag - Radio buttons 19 Copyright © 2002 Pearson Education, Inc.

Radio buttons - tag Small circles that operate similarly to checkboxes, except that only one button within the group can be selected at any given time Visa American Express Mastercard 20 CGI variable name CGI variable value label displayed next to radio button

tag - Selection lists Used to create a list for user to choose from, either as a drop- down menu or a scrolling box: Win95 Win98 Win2k linux For a scrolling box, specify SIZE greater than one. e.g. SIZE = 3 will generate a scrolling windows 3 rows high 21 CGI variable name list items that user can select CGI variable value

Form generation using PHP - Example 22

Form generation using PHP - Example - output 23

Example form Selection list Radio buttons Text box Text area Text box Submit button

PHP Same Page Processing A form can be sent to a different PHP page for processing, or can be processed on the same page. The action property of the form will determine who processes the form In order for a form to be processed on the same page, the page will have to be a PHP page and you will need to check for the submit button to be pressed. (not empty) – Also the Action of the form can be set to the same page or left empty.

Example <?php if (!empty($_POST['mailing-submit'])) { //Code to be executed upon processing the form; } ?> Adapted From: BAVOTA, C. (2009) Processing Multiple Forms on One Page with PHP [ONLINE] URL: It is a good idea to kill the script if the form is not filled by checking for set variables after the submit button is pressed

Example Multiple Forms Adapted From: BAVOTA, C. (2009) Processing Multiple Forms on One Page with PHP [ONLINE] URL:

Multiple Form Processing – Same Page <?php if (!empty($_POST['mailing-submit'])) { //do something here to process the first form; } if (!empty($_POST['contact-submit'])) { //do something here to process the second form } ?> Adapted From: BAVOTA, C. (2009) Processing Multiple Forms on One Page with PHP [ONLINE] URL:

PHP – User Defined Functions

Functions Functions are self-contained units of a program designed to accomplish a specified task such as calculating a mortgage payment, retrieving data from a database, or checking for a valid input PHP provide a good number of built-in functions and we have seen some of them, but there is a time when the built in functions are no longer capable of accomplishing your programming goals – that’s when we start coding user defined functions

Functions By definition a function is a block of statements that not only perform some task, but can also return a value. A function is independent of the program and is not executed until called

Declaration, Definition and Invocation Declaration: Is to give it a name along with the keyword function and a set of parenthesis that might contain parameters(arguments) that the function will accept. Definition: It’s the declaration AND the body of statements found within the curly braces after the function’s declaration Invocation: Refers to calling the function (tells PHP to start executing the statements withing the curly braces

Declaration, Definition and Invocation function do_something() // Declaration function do_something() { statement1;// Definition statement2; } do_something(); // Invocation

Where to Put Them Commonly used functions are often stored in separate fules to reuse as needed (using include or require PHP functions to load them) They can also be declared anywhere within a file and they are available only to the script where they are defined. Functions can be called before or after its definition (PHP internally compiles all function definitions before executing the statements in the script)

Function Example The following function Prints a custom message to the screen. Note that within curly braces, any legal PHP code is accepted, including other functions, calls, HTML, declaration of new variables, even calls to itself. <?php function bye() { print "Bye, Adios, Au Revoir, Adieu, fo, do svidaniya"; } ?>

Naming Conventions Function, like variables, has naming conventions: 1.It must consist of letters, digits, or the underscore and cannot begin with a digit. 2.The name must be unique for each function. 3.It should be given a name that indicates its purpose with an action word or a verb. 4.Function names are NOT case sensitive. Convention uses lowercase names.

Passing Arguments To send values to a function, it must be called (and defined) with a comma-separated list of arguments enclosed in parenthesis. The Arguments can be a combination of numbers, strings, references, variables etc. There are two ways of passing parameters to a function: by value and by reference

Passing Parameters by VALUE When passing a parameter by value, PHP makes a copy of the variable, so that if the function changes it inside the function, only the copy is being changed. When the function exits, the copy is destroyed. This is considered a safe way to pass arguments and is designed to be the default.

Example Calculate Volume: The Form Passing Arguments Find the volume (in feet) of a rectangular room with sides by by

The PHP <?php extract($_REQUEST); //$_REQUEST is an associative array that by default contains the contents of $_GET, $_POST and $_COOKIE. volume($s1, $s2, $s3); // Passing 3 arguments and calling the function function volume($side1,$side2,$side3){ print "The volume of the room is: ". $side1 * $side2 * $side3."cubic ft. "; } ?>

Passing Parameters By REFERENCE Only variables can be passed by reference. When passing values by reference, the function can change the value of the parameter being passed. To pass a parameter by reference, the variable being passed is preceded by the symbol ‘&’ in the function declaration line.

Example Parameters by Reference function html_tags(&$text, $tags="pre"){ switch($tags){ case 'br': $text = "$text "; break; case 'p': $text = " $text "; break; default: $text = " $text "; break; } This function receives 2 arguments: $text is passed by reference so the function will modify it $tags is passed as a value and it has a DEFAULT VALUE (pre) This function will format the string with the appropriate HTML tag in the appropriate place

Example Parameters by Reference Firs Call Example: $colors = array('red','green','blue'); $list=print_r ($colors,true); html_tags($list); echo "$list"; An array with 3 colors print_r will print the contents of the argument variable and save it to the variable $list then the function html_tags is called with only 1 argument, the list; the second parameter will take the value of PRE which is the DEFAULT Array ( [0] => red [1] => green [2] => blue ) Browser Output Browser Code View

Example Parameters by Reference Second Call Example: the string “Hello World” is going to be formatted here with tags so the “p” tag is passed by value and the $string by reference; the functions changes the string by adding the tags. notice the code view returned by the browser and the spacing in the browser output $string = "Hello, world!"; html_tags($string,"p"); echo "$string"; Hello, world! Hello, world! Browser Output Browser Code View

Returning Values Most of the time, a function will be constructed to make a calculation and return a value The RETURN statement in a functions allows the function to send a value back to the caller or to exit the function before it reaches the end.

Example - Return <?php $grades=array(40,90,89,93,75); $result = average($grades); // Pass an array print "The average grade is $result. "; function average($scores){ $sum = 0; $size = count($scores); // Find the size of the array if ( $size == 0 ){ echo "Empty parameter list "; die(); } // Exit the script here – exit(); can also be used here. for($i = 0; $i < $size; $i++){ $sum += $scores[$i]; //sums each score to the total ($sum) and stores in $sum } return $sum/$size; // Return the average } ?>