HTML and Forms Please use the speaker notes to receive the comments accompanying the slides!

Slides:



Advertisements
Similar presentations
LIS651 lecture 0 forms Thomas Krichel
Advertisements

Supplement Creating Forms. Objectives Show how forms are used How to create the Form element HTML elements used for creating input fields.
Creating Web Page Forms. Objectives Describe how Web forms can interact with a server-based program Insert a form into a Web page Create and format a.
Tutorial #9 – Creating Forms. Tutorial #8 Review – Tables Borders (table, gridlines), Border-collapse: collapse; empty-cells: show; and rowspan, colspan.
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.
HTML Forms What is a form.
XP Tutorial 6New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Creating Web Page Forms Designing a Product Registration Form Tutorial.
Web111a_chapt06.ppt HTML: Section 6 Forms HTML tags: define data input and/or output Define the Input and/or Output on the web page Do not process the.
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.
Tutorial 7 Creating Forms. Objectives Session 7.1 – Create an HTML form – Insert fields for text – Add labels for form elements – Create radio buttons.
INTRODUCTORY Tutorial 8 Creating Forms. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Create an HTML form Create fields for text Create.
2.2 XHTML (cont.). Motto Yea, from the table of my memory I’ll wipe away all trivial fond records. —William Shakespeare.
HTML Forms.
LOGO FORMs in HTML CHAPTER 5 Eastern Mediterranean University School of Computing and Technology Department of Information Technology ITEC229 Client-Side.
Dreamweaver MX. 2 Overview of Templates n Forms enable you to collect data from ______. n A form contains ________ such as text fields, radio buttons,
C REATING HTML F ORMS. Web forms allow you to receive feedback, orders, or other information from your Web pages readers. If you’ve ever used a Web search.
CHAPTER 7 Form & PHP. Introduction All of the following examples in this section will require two web pages. The first page retrieves information posted.
1 Form Elements  Form elements have properties: Text boxes, Password boxes, Checkboxes, Option(Radio) buttons, Submit, Reset, File, Hidden and Image.
1 PROJECT 5 WEB/HTML COMPUTER PURCHASE FORM Management Information Systems, 9 th edition, By Raymond McLeod, Jr. and George P. Schell © 2004, Prentice.
FORMS. Forms are used to receive information from the web surfer, such as: their name, address, credit card, etc. Form fields are objects that allow.
1 Review of Form Elements. 2 The tag Used in between tags.  Form elements(text control, buttons, etc.. ) goes here. OR  Form elements(text control,
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 9 Key Concepts 1 Copyright © Terry Felke-Morris.
1 HTML 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.
Project 6 Creating Forms on a Web Page. Objectives Define terms related to forms Describe the different form controls and their uses Use the tag Create.
HTML Form Inputs. Creating a basic form …content goes here…
Netprog CGI and Forms1 CGI and Forms A detailed look at HTML forms.
HTML Creating Forms on a Web Page. 2 Objectives  Discuss the process of creating a form  Distinguish between data input controls and text input controls.
Week 10: HTML Forms HNDIT11062 – Web Development.
Basic Webpage Design HTML Forms. Objectives Learn how to use HTML to create a form. Explain the concept of forms Know the difference of GET and POST Discuss.
1 HTML Forms
XHTML and Forms Please use speaker notes for additional information!
Form Data (part 2) MIS 3502, Fall 2015 Brad N Greenwood, PhD Department of MIS Fox School of Business Temple University 11/10/2015 Slide 1.
Web Forms. Web Forms: A form allows our web visitors to submit information to us. Some examples uses for forms are to let the web user contact us, fill.
HTML FORM. Form HTML Forms are used to select different kinds of user input. HTML forms are used to pass data to a server. A form can contain input elements.
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.
Ashima Wadhwa Java Script And Forms. Introduction Forms: –One of the most common Web page elements used with JavaScript –Typical forms you may encounter.
XP Tutorial 6New Perspectives on HTML, XHTML, and DHTML, Comprehensive 1 Creating Web Page Forms Designing a Product Registration Form Tutorial 6.
2440: 141 Web Site Administration Web Forms Instructor: Joseph Nattey.
Creating and Processing Web Forms
HTML Again GUI Items Originally HTML 4 Copyright © Curt Hill.
Form Data (part 2) MIS 3502, Fall 2015 Jeremy Shafer Department of MIS
Client-Side Internet and Web Programming
Making your HTML Page Interactive
PHP: Forms FdSc Module 109 Server side scripting and Database design
How to Write Web Forms By Mimi Opkins.
Objectives Design a form Create a form Create text fields
Forms Web Design Ms. Olifer.
HTML Forms Pat Morin COMP 2405.
FORMS IN HTML.
Web Programming– UFCFB Lecture 10
النماذج عند الانتهاء من هذا الدرس ستكون قادرا على:
Introducing Forms.
1.5 FORMS.
HTML Forms and User Input
Objectives Explore web forms Work with form servers
Creating Form Elements
Creating Form Elements
Web Development & Design Foundations with H T M L 5
Forms Data Entry and Capture
FORM OBJECT When creating an interactive web site for the Internet it is necessary to capture user input and process this input. Based on the result of.
Creating Forms on a Web Page
© Hugh McCabe 2000 Web Authoring Lecture 8
Lesson 6: Web Forms.
Making your HTML Page Interactive
Unit 5 Create Forms.
Presentation transcript:

HTML and Forms Please use the speaker notes to receive the comments accompanying the slides!

Web10.html

Testing forms NAME: COURSE: Lotus Notes Internet User Advanced COBOL Database Programming MAJOR: Computer Information Systems Business Administration Other major Comments: COMMENTS Web10.html The information about the FORM are enclosed between.

FORM sent using Web10.html and receipt from that form in my . Contents of received from form in left panel. name=Grocer course=CIS44 course=CIS51 major=CI comments=COMMENTS This is a test of a form!!!

NAME: COURSE: Lotus Notes Internet User Advanced COBOL Database Programming Web10.html - 1st part of form INPUT with TYPE=“TEXT” creates a text box for data entry. The box is given the NAME=“name” and SIZE=“10” meaning it will only show 10 characters. INPUT with TYPE = “CHECKBOX” sets up a series of checkboxes each with the NAME=“course”. This allowed me to check multiple checkboxes. Each check box is labeled with the words shown such as Lotus Notes or Internet User, but the VALUE is what is sent via e- mail. Note that the course information received in my e- mail was CIS44 & CIS51 name=Grocer course=CIS44 course=CIS51 major=CI comments=COMMENTS This is a test of a form!!!

MAJOR: Computer Information Systems Business Administration Other major Comments: COMMENTS Web10.html (2nd part) TYPE=RADIO” will set up a radio button. In this case it will be named major (NAME=‘major)and the VALUE will be sent when the form is submitted. Note that these three lines of code set up three radio buttons each named major but with different values. The TEXTAREA is an area for comments. Note you can designate rows and columns to determine size. The word COMMENTS appears in the comments box. I think it would look better with this omitted. You can just omit it and leave >< there. TYPE=“SUBMIT” means the form will be set while TYPE=“RESET” clears the form. The value is the designation that appears on the button. name=Grocer course=CIS44 course=CIS51 major=CI comments=COMMENTS This is a test of a form!!! Data received via . Note the name on the radio button above is major and major appears here in the left column. CI is the value of the major that was checked. Text that appears on the screen helping to clarify the form.

Web13.html - as seen

This is the output from web13.html that was sent. name=Priscilla Grocer city1=Fall River city2=New Bedford city3=Taunton city4=Fall River city4=New Bedford course=CIS44 course=CIS51 major=CI comments=COMMENTS Testing the form from Web13.html! Web13.html - output and receipt

Testing forms NAME: CITY: Fall River, MA New Bedford, MA Taunton, MA Fall River, MA New Bedford, MA Taunton, MA Web13.html (1st part of HTML code) The SELECT allows the user to make a selection by scrolling down and highlighting. OPTION shows the values that will be seen. Note there must also be a. SELECTED means that this selection will show when the form is loaded. name=Priscilla Grocer city1=Fall River city2=New Bedford

Fall River, MA New Bedford, MA Taunton, MA In this one, hold down SHIFT to make multiple choices that are adjacent and hold down the CONTROL to make other multiple choices. Fall River, MA New Bedford, MA Taunton, MA Web13.html (2nd part of HTML code) city3=Taunton city4=Fall River city4=New Bedford SIZE=“2” means that 2 options will be shown. The VALUE is what is sent, the data after is what appears on the screen. MULTIPLE means that multiple OPTIONs can be selected.

COURSE: Lotus Notes Internet User Advanced COBOL Database Programming MAJOR: Computer Information Systems Business Administration Other major Comments: COMMENTS Web13.html (3rd part of HTML code) course=CIS44 course=CIS51 major=CI comments=COMMENTS Testing the form from Web13.html! The words COURSE:, MAJOR: and Comments: are being used to help designate information for the user.