Start your free trial now, and begin learning software, business and creative skills—anytime, anywhere—with video instruction from recognized industry experts.

Start Your Free Trial Now

Use the form tag JavaScript and PHP Forms

Using the form tag provides you with in-depth training on Developer. Taught by Ray Villalobos as par… Show More

Validating and Processing Forms with JavaScript and PHP

with Ray Villalobos

Video: Use the form tag JavaScript and PHP Forms

Using the form tag provides you with in-depth training on Developer. Taught by Ray Villalobos as part of the Validating and Processing Forms with JavaScript and PHP
Expand all | Collapse all
  1. 3m 36s
    1. Welcome
      1m 9s
    2. What you should know
      1m 2s
    3. Using the exercise files
      1m 25s
  2. 12m 50s
    1. Understanding forms
      2m 2s
    2. Working with form fields
      7m 4s
    3. Using the form tag
      3m 44s
  3. 19m 23s
    1. Using input validation
      2m 10s
    2. Adding required fields and placeholders
      1m 31s
    3. Constraining numeric and date fields
      2m 32s
    4. Accepting multiple entries
      1m 41s
    5. Limiting uploads by MIME types
      2m 35s
    6. Assisting text input with a datalist
      1m 55s
    7. Constraining with regular expression patterns
      6m 59s
  4. 42m 13s
    1. Accessing forms
      3m 57s
    2. Looking up form elements
      3m 35s
    3. Handling focus changes
      2m 47s
    4. Detecting the onchange event
      4m 31s
    5. Using the selectedIndex property
      2m 30s
    6. Dynamic validation with regular expressions
      7m 0s
    7. Creating a generic input validation function
      4m 31s
    8. Validating in older browsers with Modernizr
      7m 32s
    9. Interrupting form submission with onsubmit
      5m 50s
  5. 15m 20s
    1. Understanding jQuery
      3m 47s
    2. Validating on submit with jQuery
      3m 45s
    3. Building interactive jQuery validation
      2m 34s
    4. Using the jQuery Validation plugin
      5m 14s
  6. 32m 57s
    1. Communicating with PHP servers
      2m 27s
    2. Retrieving data from superglobals
      8m 18s
    3. Using server-side validation
      4m 59s
    4. Adding in-page validation
      5m 22s
    5. Mirroring input data back to the user
      7m 46s
    6. Sanitizing form input
      4m 5s
  7. 43m 29s
    1. Mailing form data
      8m 28s
    2. Understanding file uploads
      3m 1s
    3. Uploading files
      9m 20s
    4. Processing form data with AJAX
      8m 14s
    5. Preparing your database
      5m 50s
    6. Pushing data
      8m 36s
  8. 1m 17s
    1. Next steps
      1m 17s

please wait ...
Using the form tag
Video Duration: 3m 44s 2h 51m Intermediate


Using the form tag provides you with in-depth training on Developer. Taught by Ray Villalobos as part of the Validating and Processing Forms with JavaScript and PHP

View Course Description

Validating web forms is a critical skill for any web developer, ensuring that the data that's submitted is complete, accurate, and nonmalicious before it's sent off to the server. Join author Ray Villalobos in this course as he shows how to validate input from site visitors with HTML5, JavaScript, and jQuery and then process the data with PHP. Plus, learn how to email form data and save it in a MySQL database so that it's ready for other applications.

Topics include:
  • Understanding forms
  • Adding required fields and placeholders
  • Accepting multiple entries
  • Limiting uploads
  • Handling focus changes
  • Validating with regular expressions
  • Working with older browsers
  • Building jQuery validation
  • Using server-side validation
  • Sanitizing form input
  • Uploading files
  • Sending form data to a database
Developer Web
JavaScript PHP

Using the form tag

So we've talked about form controls, validation, and processing, but no discussion of forms will be complete without looking at the form tag itself. The form tag is the official container for all form elements. All form fields like input text area and select go inside a form tag. The form tag has a few parameters that are super important to how it's processed and validated. First, the action parameter tells the browser the location of the form processor. This is the file that's going to take our data and process the form. The name and value fields gather from each of the form controls will be sent to this location. Another parameter, the enctype, tells the browser how the data in the form should be encoded.

And you have three options, the default which is what happens if you don't include the field is, application x www form urlencoded, which frankly sounds way too complicated. It just means that the browser will convert the data into a series of name and value pairs, and modify the data so that special characters like spaces and non alphanumeric characters have to be converted to make it easier for the browser to send the form. Thankfully since it's a default you don't have to include it.

The multi-part form data enctype is used for sending forms when the users need to upload a file. The data is actually sent in several steps. And done in a more complex format called MIME. Because of the length and complexity of the format, forms that upload a file should be sent with the post method. There is another enctype that is not as popular, but I mention it here because you might run into it. It's called text slash plain. It's for sending the form without using a processing script through the computer's email application.

Although this seems like an easier option, it just sends the form fields inside an email message, and it's not really a good way to process or validate data. The last attribute is method, and it controls how the data gets sent to the processor. There are two methods, get and post. So, let's talk about those. The get method will send the data through a URL. So, to illustrate that let's take a look at what's probably the most famous form on the web. The Google search form. I'll type in a keyword here, flowers. And we'll hit the Enter button.

If you take a look at my URL bar, you can see that this got sent to a form processor. And it's passing along a bunch of information separated by ampersands. If you look right here at the q variable, you can see that it has the value of my search query. So, the query's actually being passed through a URL. This is cool because we can bookmark this URL, or copy and paste it to send someone else to the same search results page. Let's go back into our form here. If I were to submit this form with my name and title, the URL sent to the form processor would include the name, which base is converted into plus signs. And the different variables will be separated by an ampersand and any non-alphanumeric values to a percentage sign followed by two hexadecimal digits. The get method is the default, so if you don't include it, it assumes you want to send the form with a get method.

The post method sends the data to the server in the background. Some servers limit the length of the arguments passed to an application through a URL. So the post method is better for sending longer forms, and it's necessary when you're sending files. Post is considered a more secure method than get, because with get the parameters are transmitted directly through a URL which can be sniffed by malicious scripts. It's up to your form processor to accept results in either get, post or both.

So getting used to the attributes and the form tag gives you a lot of options that control where the data from the form is sent. How it is encoded, and the method by which it's sent.

There are currently no FAQs about Validating and Processing Forms with JavaScript and PHP.






Don't show this message again
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.

Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ .

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

Join now Already a member? Log in

* Estimated file size

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.

Mark all as unwatched Cancel


You have completed Validating and Processing Forms with JavaScript and PHP.

Return to your organization's learning portal to continue training, or close this page.


Upgrade to View Courses Offline


With our new Desktop App, Annual Premium Members can download courses for Internet-free viewing.

Upgrade Now

After upgrading, download Desktop App Here.

Become a Member and Create Custom Playlists

Join today and get unlimited access to the entire library of online learning video courses—and create as many playlists as you like.

Get started

Already a member?

Log in

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

You started this assessment previously and didn’t complete it.

You can pick up where you left off, or start over.

Resume Start over

Learn more, save more. Upgrade today!

Get our Annual Premium Membership at our best savings yet.

Upgrade to our Annual Premium Membership today and get even more value from your subscription:

“In a way, I feel like you are rooting for me. Like you are really invested in my experience, and want me to get as much out of these courses as possible this is the best place to start on your journey to learning new material.”— Nadine H.

Thanks for signing up.

We’ll send you a confirmation email shortly.

Sign up and receive emails about and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from

Sign up and receive emails about and our online training library:

Here’s our privacy policy with more details about how we handle your information.

submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.