ITM 352 - © Port, Kazman1 ITM 352 HTML Forms, Basic Form Processing.

Slides:



Advertisements
Similar presentations
Lecture 6/2/12. Forms and PHP The PHP $_GET and $_POST variables are used to retrieve information from forms, like user input When dealing with HTML forms.
Advertisements

PHP Workshop ‹#› Forms (Getting data from users).
HTML Form and PHP IST Review of Previous Class HTML table and PHP array Winner is chosen automatically using rand() function.
Technologies for web publishing Ing. Václav Freylich Lecture 4.
Supplement Creating Forms. Objectives Show how forms are used How to create the Form element HTML elements used for creating input fields.
Tutorial 6 Working with Web Forms
USER INTERACTIONS: FORMS
There is a certain way that an HTML file should be set up. The HTML section declares a beginning and an ending. Within the HTML, there should be a HEAD.
Tutorial 6 Working with Web Forms. XP Objectives Explore how Web forms interact with Web servers Create form elements Create field sets and legends Create.
Uploading Files. Why? By giving a user the option to upload a file you are creating an interactive page You can enable users have a greater web experience.
Forms. Form An HTML form is a section of a document containing normal content, special elements called controls (checkboxes, radio buttons, buttons, etc.),
Forms, Validation Week 7 INFM 603. Announcements Try placing today’s example in htdocs (XAMPP). This will allow you to execute examples that rely on PHP.
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.
Unit 7 – Working with Forms 1. Creating a form 2. Accessing the submitted data 3. Common operations on forms.
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.
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.
XP Tutorial 6New Perspectives on HTML and XHTML, Comprehensive 1 Creating Web Page Forms Designing a Product Registration Form Tutorial 6.
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:
1 Creating Web Forms in HTML Web forms collect information from customers Web forms include different control elements including: –Input boxes –Selection.
Lecture 6 – Form processing (Part 1) SFDV3011 – Advanced Web Development 1.
Forms and Form Controls Chapter What is a Form?
Lecture 7 – Form processing (Part 2) SFDV3011 – Advanced Web Development 1.
CSE 382/ETE 334 Internet and Web Technology Presented By Dr. Shazzad Hosain Asst. Prof. EECS, NSU.
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.
BBK P1 Module2010/11 : [‹#›] Forms (Getting data from users)
Forms and Server Side Includes. What are Forms? Forms are used to get user input We’ve all used them before. For example, ever had to sign up for courses.
LOGO FORMs in HTML CHAPTER 5 Eastern Mediterranean University School of Computing and Technology Department of Information Technology ITEC229 Client-Side.
Introduction to HTML Part 3 Chapter 2. Learning Outcomes Identify how to design frames. Explain frames’ attributes. Describe the method on designing forms.
ITM © Port, Kazman1 ITM 352 More on Forms Processing.
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.
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,
HTML Form and PHP IST Review of Previous Class HTML table and PHP array Winner is chosen randomly using rand() function.
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.
Intro to PHP IST2101. Review: HTML & Tags 2IST210.
Tutorial 6 Working with Web Forms. XP Objectives Explore how Web forms interact with Web servers Create form elements Create field sets and legends Create.
Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.
1 HTML Forms
HTML Forms. Slide 2 Forms (Introduction) The purpose of input forms Organizing forms with a and Using different element types to get user input A brief.
HTML Forms a form is a container for input elements on a web page input elements contain data that is sent to the web server for processing.
ITM © Port, Kazman1 ITM 352 More on Forms Processing.
HTLM Forms CS3505. Form Handling in Browser html User Files out form WEbBROWSErWEbBROWSEr User read response submit Get URL?input html Get file html script.
Introduction To HTML Form Inputs Written By George Gimian.
SYST Web Technologies SYST Web Technologies XHTML Forms.
Web Page Design Forms! Website Design. Objectives What forms can do The Attributes of the form tag Using Textboxes Textareas Checkboxes Radio buttons.
+ FORMS HTML forms are used to pass data to a server. begins and ends a form Forms are made up of input elements Every input element has a name and value.
Copyright © Texas Education Agency, All rights reserved.1 Web Technologies Website Forms / Data Acquisition.
©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.
Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.
HTML Forms.
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.
HTML FORM AND PHP IST 210: Organization of Data IST210 1.
Session 11: Cookies, Sessions ans Security iNET Academy Open Source Web Development.
HTML III (Forms) Robin Burke ECT 270. Outline Where we are in this class Web applications HTML Forms Break Forms lab.
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,
Day 22, Slide 1 CSE 103 Day 22 Non-students: Please logout by 10:12. Students:
2440: 141 Web Site Administration Web Forms Instructor: Joseph Nattey.
ITM 352 HTML Forms, Basic Form Processing
Introducing Forms.
HTML Forms and User Input
Presentation transcript:

ITM © Port, Kazman1 ITM 352 HTML Forms, Basic Form Processing

ITM © Port, Kazman2 Some Inspiration!  Perseverance: never giving up  Indomitable Spirit: never wanting to give up  Formula for success  Perseverance + Indomitable Spirit = Success  Indomitable Spirit  “Get to your limit and see what’s on the other side” - Yoga  "Try not. Do, or do not. There is no try." - Yoda  “Suffering is optional” – Yoghurt  “If you’re brain is hurting it just means you’re learning” – P 2

ITM © Port, Kazman3 What We Will Cover Today  Today we will explore HTML forms in some detail:  Details on  Input types  Compound types  Some tips for HTML form elements

ITM © Port, Kazman4 Form Parts  action is the file you want to go to (could be html or php)  method should be either POST or GET

ITM © Port, Kazman5 Action  An action should be a URI (e.g. a file name in the current folder) or a full web address, e.g.  Example: …  This will take the user to the invoice.php page in the current directory when the user presses the submit button. Note: You should always use quotes around the URI in case it has special characters or spaces.

ITM © Port, Kazman6 Method  The method can be either 'POST' or 'GET'.  $_GET and $_POST are arrays built into PHP which make form processing a lot easier.  Form variables are stored as keys (elements) of these arrays, indexed by their name  To see what is in the array just do a var_dump() e.g. var_dump($_GET);  TIP: put var_dump() at the top of form processing files so you can see what is sent from the form

ITM © Port, Kazman7 Submit Button Usually you need to have a submit button to invoke a form's action, e.g.: <input type = 'SUBMIT' name = ' the name you want to appear in the POST/GET array ' value = ' the label in the button ' >

ITM © Port, Kazman8 Example: Login Do Lab #1

ITM © Port, Kazman9 Input types (single value) A generic input type looks like this: ' name = ' ' value = ' ' >

ITM © Port, Kazman10 The Basic Input Types  Text  Password  Hidden  Radio  Checkbox  Submit

ITM © Port, Kazman11 Login <?php print "logged in ". $_POST['username']; ?> Do Lab #2

ITM © Port, Kazman12 Self-Processing Form  Sometimes you want to stay on the same page when processing your forms ' method = 'post'> is the same as: 'method = 'post'>  <?= is short for echo when embedding PHP in HTML  You can use $PHP_SELF or $_SERVER['PHP_SELF']

ITM © Port, Kazman13 Login if( array_key_exists('submit_button', $_POST) ) { print "logged in ". $_POST['username']; } else { ?> ' method = 'post'> Do Lab #3

ITM © Port, Kazman14 GET method … GET will show the information being passed between pages as part of the URL.  Good tool for error checking  However, it is not secure because users can see the full contents of the request.  Pages can be cached.

ITM © Port, Kazman15 POST method … POST will hide information being passed between pages in the address bar.  HINT: use GET for error checking; change to POST when submitting your work  More secure than GET  Pages won't be cached. Do Lab #4

ITM © Port, Kazman16 Compound Types  Select  Text area  List box  Compound types enable multiple inputs and/or outputs  Unlike input types, compound types always use a begin and end tag …

ITM © Port, Kazman17 Login if( array_key_exists('submit_button', $_POST) ) { print "logged in ". $_POST['username']; } else { ?> ' method = 'post'> Moe Larry Curly <input type = 'submit' name = 'submit_button' value = 'login'>

ITM © Port, Kazman18 Select Boxes  Select boxes provide a drop down set of options for the user to choose from.  Value is whatever the user chooses when the submit button is pressed  If no value parameter is set, the value defaults to the label  thing1 thing2 thing3

ITM © Port, Kazman19 Text Area  Text Area provide a region of size row X cols to display and input text.  Value is whatever is in the area when the submit button is pressed This is some text in the text area.

ITM © Port, Kazman20 Tips and Hints  Use single ' ' on the inside, " " around the outside or vice versa  Take advantage of PHP by using for/while/foreach to generate multiple form elements and compound types  Quotes must be used around anything with spaces Do Extra Credit (optional)