10+ JQuery tutorials for working with HTML forms

Submit A Form Without Page Refresh using jQuery

Submitting a form with refreshing the page have many good points: For example, if the person forgot to fill a field, he’ll have a notice but he’ll not have to re fill all the form fields again.
This tutorial will help you creating a form that can be submitted without page refreshing, using JQuery.

Read tutorial

Form validation with jQuery from scratch

Good validation of forms is extremely important, because of course you don’t want people to be able to send any kind of data. JQuery can help you lots with form validation, and this tutorial will tell you how to build a JQuery form validation from scratch.

Read tutorial

Improved Current Field Highlighting in Forms

Both visually and pratically, forms are often a neglected part of a website. CSS expert Chris Coyier have written this nice tutorial, which will tell you how to improve your form usuability and enhance them visually.

Read tutorial

A jQuery inline form validation, because validation is a mess

Another good article to learn about “inline validation”, the process of validating a form with refreshing the page. A must read, especially if your site have several long (and boring) forms.

Read tutorial

AutoCompleter Tutorial – jQuery(Ajax)/PHP/MySQL

Ajax have bring lots of new awesome possibilities to Web Developers. One of them if autocompletion, the process of retrieving data automatically while the user is typing. This tutorial will tell you how to create a cool text field autocompletion using JQuery.

Read tutorial

Selecting Multiple Select Form Elements on the Fly

Javascript is very good to enhance your forms usuability. Using JQuery, you’ll save a precious time and do lots of things in a simpler manner that if you where using “classic” Javascript.
This tutorial is a very good example of JQuery’s power when it comes to forms.

Read tutorial

Build An Incredible Login Form With jQuery

I definitely love that one. Have you ever seen theses websites where clients or registered users can click on a link to make a login panel appear? If you loved it, Nettuts tells you how to do it. It’s so easier that you’ll be surprised.

Read tutorial

Creating a Digg Style Sign Up Form

Although Digg may be controversial at some point, everyone agrees that their site design is tip top. Designshack created this tutorial, where you can lear to create a very nice, “digg-style” sign up form.

Read tutorial

Enlarge input fields on focus

How can you type a long text in a 200 pixels wide textarea? If this sounds good to you, you’ll probably enjoy this article where you’ll learn how to automatically enlarge input fields at focus.

Read tutorial

WordPress contact form without a plugin, using jQuery

As I know most of my readers have a WordPress blog and generally likes to tweak it, I’m pretty sure that you’ll love to learn how to create a contact form plugin, using JQuery.

Read tutorial

jQuery Ajax Delete

Lots of tutorials tells you how to add content using Ajax, but finding great info about deleting content isn’t that easy. In this tutorial, you’ll learn how to remove content using JQuery, for a similar result than in WOrdPress dashboard, when you validate a comment in the “Pending” section.

Read tutorial