Best jQuery Forms Plugins & Tutorials with Demo

Inspiration for Text Input Effects 2

Inspiration for Text Input Effects

We’ve updated and added some more effects to the Inspiration for Text Input Ideas. The second set contains some more styles that we thought about and collected after we released the first set about three month ago. The concept is the same: make (subtle) enhancements for text inputs to make them more engaging and fun.

Drag N’ Drop Form-builder for PHP

Drag N' Drop Form-builder for PHP

The Drag N’ Drop form builder provides an easy to use tool for creating an almost infinite configurations for end-user forms. Using the simplicity of drag-and-drop and user experience patterns available in most integrated development environments, you can customize forms in several ways.

 

  • Choose from 11 different draggable fields to create your form
  • Create custom themes easily
  • File-upload control with Amazon S3 cloud integration
  • Export registrant list to an excel spreadsheet
  • Customize required field validation
  • Add tooltips as a help-resource
  • Real-time updating

Labelholder : jQuery Placeholder Plugin as labels for Bootstrap

Labelholder : jQuery Placeholder Plugin as labels for Bootstrap

This jQuery plugin allows you to use placeholders as labels in your Bootstrap forms.

  • It fully supports Bootstrap ~> 3.0
  • No markup changes required if used with Bootstrap
  • It uses :before pseudo-element instead of adding its own element for label
  • It does not change element’s height causing the whole page content to go a bit down
  • And it does not require you to use non-equal paddings

 

Nice Looking Contact Form with CSS & jQuery

Nice Looking Contact Form with CSS & jQuery

A simple and easy to customize contact form. A minimal and customizable snippet to throw a semantic form into your web projects on the fly.

jQuery Bootstrap Popover Picker

jQuery Bootstrap Popover Picker

Generic jQuery plugin template for building pickers using Bootstrap popovers, fully customizable with a powerful base API, including jQuery.UI position plugin.

Vanilla Form : Modern & Responsive Contact Form

Vanilla Form : Modern & Responsive Contact Form

Vanilla Form uses JavaScript to send filled data to server using AJAX. This means, your page won’t reload after form submit. Vanilla Form was written with speed and independence in mind. It loads fast and can work without 3rd party library like jQuery. But if you want to, you can easily integrate it with any web framework you want. Vanilla Form uses standard HTML 5 form elements and makes them nicer thanks the CSS 3 style rules.

ParamQuery Select : jQuery Multi Select Plugin

ParamQuery Select : jQuery Multi Select Plugin

PqSelect is a jQuery select plugin which converts ordinary multiple and single select lists into theme ready jQueryUI widget with support for grouping, disabled options, checkboxes for multiple select lists, radio buttons for single select lists, search box to search options, keyboard navigation and many options, methods and events.

jQuery Autotab Plugin

jQuery Autotab Plugin

Autotab is a jQuery plugin that provides auto tabbing and filtering on text fields in a form. Once the maximum number of characters has been reached within a text field, the focus is automatically set to a defined element. Likewise, clearing out the text field’s content by pressing backspace eventually places the focus on a previous element.

jQuery Bootstrap Checkbox

jQuery Bootstrap Checkbox

A checkbox component based on Bootstrap framework.

transForm : jQuery Customize Form Look plugin

transForm : jQuery Customize Form Look plugin

Using transForm jQuery plugin you could customize the look and feel of your web forms. They will be displayed identically into every modern web browser.

Features:

  • Supports wide range of form tags, including fieldset, legend, label, multiple select and new HTML5 input types.
  • Keeps logical structure of the form elements, so the HTTP request will be identical as normal form.
  • The drop-down menus are fully styled (not only the header).
  • Text areas can be configured to be expandable (when the caret goes to new line).
  • Configurable maximum character limit for text areas.
  • Easy to change the status of transformed elements from JavaScript (changing value, disabled, readonly, checked attributes) using acquired DOM element