Interactive RSVP Form – Halloween Party

Today you will be learning how to create an interactive RSVP web form for a Halloween Party.

“Répondez s’il vous plaît”, a French phrase that translates to “please respond”" or literally “respond, if you please” [1]. It is with this meaning that invitation cards and similar documents are often marked with “R.S.V.P.” It is standard practice to reply to an RSVP request whether confirming attendance or declining.

http://en.wikipedia.org/wiki/RSVP

—-Actual Interactive Web Form Starts Here—

—-Actual Interactive Web Form Ends Here—

 The software you will be using is an online web application call JotForm.
image003
https://www.jotform.com

What is JotForm?
JotForm is a WYSIWYG form builder. Its intuitive drag and drop user interface makes form building a breeze. Using JotForm, you can create forms, integrate them to your site and collect submissions from your visitors.

JotForm is a completely web based form builder. It is developed for webmasters with minimum design experience. JotForm has an intuitive drag & drop and instant edit form editor. You can create web forms, collect submissions and payments from your users.

  • WYSIWYG is an acronym for What You See Is What You Get, used in computing to describe a system in which content displayed during editing appears very similar to the final output, which might be a printed document, web page, slide presentation or even the lighting for a theatrical event.
  • Drag-and-drop or DnD is the action of (or support for the action of) clicking on a virtual object and dragging it to a different location or onto another virtual object. In general, it can be used to invoke many kinds of actions, or create various types of associations between two abstract objects.
  • A web form on a web page allows a user to enter data that is, typically, sent to a server for processing and to mimic the usage of paper forms. Forms can be used to submit data to save on a server (e.g., ordering a product) or can be used to retrieve data (e.g., searching on a search engine).

Here is a short list of forms you can create with a computer?

  1. Contact Form
  2. Survey
  3. Event Calendar
  4. Document Uploaded
  5. Satisfaction Survey
  6. Time Sheet
  7. Job Application Form
  8. RSVP for a Party or Wedding
  9. Bug Tracker
  10. Reservation Form

You will need:

  1. a title by using the Heading Tool
  2. a description of your party by using the Text Tool
  3. to capture your guest info – First Name *, Last Name *, Email, Telephone * by using the TextBox Tool
  4. a selection box for your guest to pick a movie they want to watch that night by using the RadioButton Tool
  5. A text area for your guest to indicate what kind of refreshments or music they would like to bring by using the TextArea Tool
  6. A CAPTCHA verification form to prevent SPAM by using the CAPTCHA Tool

A CAPTCHA or Captcha is a type of challenge-response test used in computing to ensure that the response is not generated by a computer. The process usually involves one computer (a server) asking a user to complete a simple test which the computer is able to generate and grade. Because other computers are unable to solve the CAPTCHA, any user entering a correct solution is presumed to be human.

Spam - unsolicited commercial e-mail sent to a large number of addresses.

image005 

Properties

You will need to properly label and applied the right setting to each of your form fields.
Here are some examples.

  • image009
  • image006
  • image007
  • image008

Bonus Mark!!

Form Validations
Applied a form validations to check if a form field is a proper E-mail, Alphanumeric, Numeric, Alphabetic.

The first 3 students with a correctly design finish validate form will get a prize.

Handouts for Teachers

Instructional Video

Creative Commons License
Interactive RSVP Form - Halloween Party by Mong Phu is licensed under a Creative Commons Attribution-Noncommercial 3.0 United States License.
Permissions beyond the scope of this license may be available at http://www.hypertextschool.com/contact-us/.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>