Website Development & Management PHP Fundamentals CIT 3353 -- Fall 2006 www.clt.astate.edu/jseydel/mis3353 Instructor: John Seydel, Ph.D.

Slides:



Advertisements
Similar presentations
Tutorial 6 Creating a Web Form
Advertisements

Supplement Creating Forms. Objectives Show how forms are used How to create the Form element HTML elements used for creating input fields.
PHP Programming with MySQL Slide 2-1 CHAPTER 2 Getting Started with PHP.
Tutorial 6 Working with Web Forms
Computing Concepts Advanced HTML: Tables and Forms.
Website Development & Management Getting Ready for the Server-Side CIT Fall Instructor: John Seydel, Ph.D.
Website Development & Management PHP Odds & Ends Instructor: John Seydel, Ph.D. CIT Fall
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.
Creating Web Page Forms
Tutorial 6 Forms Section A - Working with Forms in JavaScript.
Web Development & Design Foundations with XHTML Chapter 9 Key Concepts.
Chapter 10 Form Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Linux Operations and Administration
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.
Website Development & Management Introduction & Overview CIT Fall Instructor: John Seydel, Ph.D.
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.
CO1552 Web Application Development HTML Forms. Websites can be made more interactive by providing facilities for users to provide data To get user entered.
1 Creating Web Forms in HTML Web forms collect information from customers Web forms include different control elements including: –Input boxes –Selection.
Forms and Form Controls Chapter What is a Form?
Lesson 13: Building Web Forms Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver CS6.
DAT602 Database Application Development Lecture 14 HTML.
Website Development & Management Getting to Know HTML Better CIT Fall Instructor: John Seydel, Ph.D.
Database-Driven Web Sites, Second Edition1 Chapter 8 Processing ASP.NET Web Forms and Working With Server Controls.
Languages in WEB Presented by: Jenisha Kshatriya BCM SS09.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Chapter 6: Forms JavaScript - Introductory. Previewing the Product Registration Form.
Website Development & Management More PHP Fundamentals CIT Fall Instructor: John Seydel, Ph.D.
XHTML Introductory1 Forms Chapter 7. XHTML Introductory2 Objectives In this chapter, you will: Study elements Learn about input fields Use the element.
Creating a Web Site to Gather Data and Conduct Research.
Robinson_CIS_285_2005 HTML FORMS CIS 285 Winter_2005 Instructor: Mary Robinson.
Website Development & Management Creating Web Pages CIT Fall Instructor: John Seydel, Ph.D.
CSC 2720 Building Web Applications HTML Forms. Introduction  HTML forms are used to collect user input.  The collected input is typically sent to a.
Apache, MySQL and PHP Installation and Configuration Chapter 3 PHP Installation and Configuration.
Website Development & Management Getting Started with Databases Instructor: John Seydel, Ph.D. CIT Fall
Tutorial 7 Creating Forms. Objectives Session 7.1 – Create an HTML form – Insert fields for text – Add labels for form elements – Create radio buttons.
JavaScript, Fourth Edition Chapter 5 Validating Form Data with JavaScript.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Website Development & Management Going Live with Web Pages (b) CIT Fall Instructor: John Seydel, Ph.D.
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.
 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.
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.
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.
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.
Microsoft FrontPage 2003 Illustrated Complete Creating a Form.
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.
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.
Website Development & Management A PHP Exercise CIT Fall Instructor: John Seydel, Ph.D.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 9 Key Concepts 1 Copyright © Terry Felke-Morris.
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.
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 The TEXT Object Presented By: Ankit Gupta.
HTML Forms.
Week 10: HTML Forms HNDIT11062 – Web Development.
COS 125 DAY 17. Agenda  Assignment 7 not finished grading  Assignment 8 posted Due April 9  Capstone progress reports due  Quiz 2 Corrected 2 A’s,
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.
Tutorial 6 Creating a Web Form
Ashima Wadhwa Java Script And Forms. Introduction Forms: –One of the most common Web page elements used with JavaScript –Typical forms you may encounter.
Chapter 5 Validating Form Data with JavaScript
Basic XHTML Tables XHTML tables—a frequently used feature that organizes data into rows and columns. Tables are defined with the table element. Table.
Presentation transcript:

Website Development & Management PHP Fundamentals CIT Fall Instructor: John Seydel, Ph.D.

Student Objectives Upon completion of this class meeting, you should: Be able to discuss the concepts involved in writing PHP scripts that  Collect data sent by an HTML form  Assign values to local variables based upon form data  Perform simple calculations  Display data and calculation results back to a web page Have resolved questions regarding the WAMP installation Summarize the markup needed to create web forms with commonly used controls  Textbox  Checkbox  Radio button  Drop-down list  Submit button

PHP Script Basics Variable naming Requirements Conventions Assignment statements Literals  Numeric  Text Variables Getting form data from global arrays Displaying values Basic calculations Control structures (basic selection)

Review: PHP Platform Installation Installing MySQLMySQL Installing/configuring ApacheApache Installing/configuring PHPPHP Note: these instructions are intended to augment, not replace the textbook’s instructions

Some More Details on HTML Forms Main element is Attributes:  id (for object references in scripts)  action (where the form processor is)  method (usually post but sometimes get) Should be only one per page (for our purposes) All controls must be within... Form controls  input (many types) input  select select  button (we won’t be using this, probably)  textarea Note the importance of the value attribute for these controlsvalue Forms represent one of the major objects in the DOMDOM Recall: processors can be either server-side or client-side Any questions... ?questions

Summary of Today’s Objectives Resolve questions regarding the WAMP installation Develop ability to write a simple PHP-based form processor that  Collects data sent by an HTML form  Assigns values to local variables based upon form data  Performs simple calculations  Displays data and calculation results back to a web page

If Time Permits... Demonstration: web pages are HTML files and are thus independent of the editors used and the means used to upload/download them Capture CoB web page  students.htm  This is a DreamWeaver page Edit in NotePad Use FrontPage to upload back to CoB site Questions Troubles encountered when installing WAMP? Why don’t we meet in the lab? Other... ? Using phpinfo() to view form data

Appendix

The Installation Process: MySQL Generally follows procedure given in Meloni textbook Download mysql win.zip from course Handouts page (or from MySQL.com) into Downloads directory Uncompress into a default temporary directory and then open that directory Double-click on SETUP.EXE and accept all defaults as the installation wizard runs Test the installation Run c:\mysql\bin\winmysqladmin.exe Provide a username and password you’ll remember (generally, these won’t be used again, ever) Note the stoplight now on taskbar at bottom right MySQL’s database server now starts upon bootup For now, go no further (i.e., not beyond p. 8)

The Installation Process: Apache Again, ensure that IIS is stopped Also follows procedure given in Meloni textbook but with some variations; assumes you’ll be installing PHP right away Download apache_ win32-x86-no_ssl.msi from course Handouts page (or from Apache.org) into Downloads directory Double-click on apache_ win32-x86-no_ssl.msi Accept defaults as the installation wizard runs Don’t worry for now about Server Information panel Verify the installation Note the feather icon near the right end of the taskbar Point browser to (output displayed on p. 29 should appear) Modify the configuration...

Modifications to Apache Edit the configuration file: c:\Program Files\Apache Group\Apache2\conf\httpd.conf Specify server settings: Find ServerAdmin statement and set the argument to your address Find ServerName statement and set the argument to your IP address or to Two more changes: Add to the end of the LoadModule section LoadModule php5_module c:/php/php5apache2.dll Add to the end of the AddType section AddType application/x-httpd-php.phtml.php Do not restart Apache until after installing PHP

The Installation Process: PHP Varies somewhat from procedure given in Meloni textbook Download php Win32.zip from course Handouts page (or from PHP.net) into Downloads directory Uncompress into a permanent directory (c:\php) and then open that directory Configure PHP (see next slide) Restart Apache Click on taskbar icon (feather) Then Apache2 | Restart

Configuring PHP Make changes to files Copy c:\php\php.ini-dist to c:\WINDOWS Rename c:\WINDOWS\php.ini-dist to c:\WINDOWS\php.ini Edit c:\WINDOWS\php.ini  Open in NotePad  Find and uncomment (remove “;”) extension=php_mysql.dll  Find and set error reporting configuration error_reporting = E_ALL & ~E_NOTICE display_errors = On  Setup for (example) SMTP = smail.astate.edu sendmail_from =  Save and close the file Copy c:\php\php5ts.dll to c:\WINDOWS\system Copy c:\php\ext\php_mysql.dll to c:\WINDOWS\system Copy c:\mysql\bin\libmysql.dll to c:\WINDOWS\system Restart Apache

Browser/Server Interaction

The HTML Document Object Model Option Browser objects: objects that provide access to the browser

Input Elements Empty element with many controls (per the type attribute) One line text box (text)text Check boxes (checkbox)checkbox Option buttons (radio)radio Submit/reset button (submit or reset) Other common attributes name (always specify) size (also maxlength, but not same) value

Text Boxes Format: Simplest type of input Disadvantage: can’t control what’s typed except through Using maxlength JavaScript validation is better Fonts: Can’t be controlled, except with style sheets Size differs across browsers

Check Boxes Format: Each box has a different name and set of attributes Notes about attributes Value submitted for value attribute  If checked then whatever value is specified  Else “” The checked attribute is binary (0 or 1) Don’t confuse with option buttons

Option Buttons Format: Must define an option group That is, multiple controls all with same name Each control within group has different value Only one of any group can be checked at a time When form is submitted, only the value of the checked control will be sent Like multiple choice question: Option button ~ “mark the best answer” Check box ~ “mark all that apply”

Select (“Combo” or “List”) Box Involves two elements (main element; container) (contained in select element) Main select attributes name size Event handlers (e.g., onChange) Primary option attributes value selected

Buttons, Buttons, Everywhere Three kinds of buttons (not including reset) element (empty element)  Server-side processing:  Client-side processing: element: contains inline & block elements  Client-side processing only  Allows control over display (images, font, etc.)  Format:... content... A note on client-side processing Button requires the onClick attribute Invokes the JavaScript function specified

The value Attribute Can be preassigned to a control Shows up in text controls and on buttons With other controls, values are hidden and are assigned to variables associated with controls When form is processed, value is whatever is entered into control If text box or text area, then text string Otherwise it’s a preassigned value  Check boxes  Buttons: submit, reset, option, button  Select (combo) boxes

Names to Use for Controls Use conventions from programming languages: Java, C++, Visual Basic Typically First 3 characters lowercase and type of control Uppercase only when words joined (intercap) Control TypePrefixExample TextboxtxttxtFirstName Text AreatxttxtFeedback CheckboxchkchkRetirement Option ButtonoptoptClass Dropdown ListlstlstWeekDay Submit ButtoncmdcmdCalculatePay