Collecting Information from the User

Slides:



Advertisements
Similar presentations
COS 125 DAY 24. Agenda Assignment 7 is due today Assignment 7 Assignment 8 (last one) is posted  Due May 2 Left to do  3 rd and final Capstone progress.
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 6 Working with Web Forms
Python and Web Programming
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.
HTML Tables and Forms Creating Web Pages with HTML CIS 133 Web Programming Concepts 1.
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.
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.
1 Creating Web Forms in HTML Web forms collect information from customers Web forms include different control elements including: –Input boxes –Selection.
WEB FORM DESIGN. Creating forms for a web page For your web project you have to design a form for inclusion on your web site (the form information should.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
XHTML Introductory1 Forms Chapter 7. XHTML Introductory2 Objectives In this chapter, you will: Study elements Learn about input fields Use the element.
 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.
Introduction to HTML Part 3 Chapter 2. Learning Outcomes Identify how to design frames. Explain frames’ attributes. Describe the method on designing forms.
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.
Button and Textbox. Input  Input objects are used to obtain input from the user viewing the webpage. They allow the user to interact with the Web. 
1 HTML Forms
1 HTML Forms
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.
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.
1 HTML Forms
+ 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.
Links take you to…  Different slides in your presentation  A different PowerPoint presentation  Any program - (Word can be used for example to complete.
1 HTML forms (cont.)
WEB FORM DESIGN. Creating forms for a web page For your web project you have to design a form for inclusion on your web site (the form information should.
Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.
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.
Creating Web Page Forms COE 201- Computer Proficiency.
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.
1 HTML Forms
Creating Forms on a Web Page. 2 Introduction  Forms allow Web developers to collect visitor feedback  Forms create an environment that invites people.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Project 6: Creating XHTML Forms Kelly.
Command Buttons in Access Forms. What are Command Buttons?  Buttons that perform commands (duh)  With proper programming, you can make a button perform.
1 HTML forms (cont.)
Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
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 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.
2440: 141 Web Site Administration Web Forms Instructor: Joseph Nattey.
Tutorial 6 Working with Web Forms
Section 10.1 Define scripting
Creating and Processing Web Forms
Advanced HTML Tags:.
Coldpruf Online Order Form
Command Buttons in Access Forms
Checkboxes, Select boxes, Radio buttons,
Objectives Design a form Create a form Create text fields
Forms.
Section 10.1 YOU WILL LEARN TO… Define scripting
How To Use As Another Account On Gmail
Web Systems Development (CSC-215)
Forms, cont’d.
Starting to develop a website
Creating Forms on a Web Page
Form Data (part 1) MIS3501 Jeremy Shafer Department of MIS
© Hugh McCabe 2000 Web Authoring Lecture 8
COS 125 DAY 18.
HTML Forms
Coldpruf Online Order Form
Unit 5 Create Forms.
Checkboxes, Select boxes, Radio buttons
Presentation transcript:

Collecting Information from the User Form Elements

Why Use a Form? Collect info from user Example info: Contact info Choices for Products to Buy Survey results Quiz results

Elements of a Basic Form

Place a Form on Your Page Entire form will be surrounded by <form> tags All elements on your form placed between these tags Choose the name – should make sense for overall purpose of form We will add additional attributes later once we need to get the form actually working!

Text Turns this element into a text box Provides a name – so we can access information collected from this element later! Our code creates this – difficult for user to know what to type!

Now the user will know what we want! Text Now the user will know what we want!

Text Can set value in text box to a default Can be annoying for user Not typically done

Now What? Can add multiple textboxes to ask for multiple pieces of info User needs a way to send that info somewhere

Setting value of type attribute to “submit” creates a submit button. Will pick up automatic meaning once we code this form to actually work.

Alter Label on the Submit Button Adding a value will alter the text that appears on the submit button.

Reset Button Will clear (erase values inside) all form fields when pressed Helps user reset form completely

Prevent All Fields on Same Line You may use break tags between form elements

Will not allow the user to type more than 100 characters Formatting Makes it display enough room for 100 characters (the default is 20 characters) Will not allow the user to type more than 100 characters