jQuery Forms Plugin & Tutorials with Example

Gridform : jQuery Plugin for Creating complex Forms

Gridform : jQuery Plugin for Creating complex Forms

jQuery-Plugin for creating complex forms (table-based) with usage of bootstrap and (optional) Font-Awesome.

  • Display a bunch of form elements in a (sometimes) complex grid
  • Have an “edit” and a “view” mode
  • Simple add validation or other event handler on form elements
  • Use the excellent bootstrap design and optional font awesome for “nicer” form ui
  • Have the ability to use elements spanning over some rows/cells of the grid (rowspan and colspan)

jQuery Form Toolltip

jQuery Form Toolltip

This jQuery plugin allows you to add Tooltip calllout (with fadeIn fadeOut animation) to your form input controls.

  • You are able to specify the individual tooltip CSS
  • You are able to specify the fadeIn and fadeOut direction. Currently supporting Top, Bottom, Right and Left

Wufoo style jQuery and HTML5 form builder

Wufoo style jQuery and HTML5 form builder

formbuilder is a Wufoo style jQuery and HTML5 form builder allows you to create user forms by dragging and dropping form elements.

This form builder is using JSON to load existing form structures and serialising existing form structures back to JSON when the save button is clicked.

Addressfield : jQuery Simple Dynamic Address field plugin

Addressfield : jQuery Simple Dynamic Address field plugin

The simple, configurable, dynamic address field plugin.This plugin enhances user experience on your address (shipping/PO) forms by dynamically…

  • Updating field labels (e.g. “ZIP code” vs. “Postcode”),
  • Adding or removing fields that are irrelevant (e.g. for a particular locales),
  • Converting fields between select lists and text fields (e.g. US States vs. counties in the UK),
  • Updating select options (e.g. US states vs. Canadian provinces)
  • Updating field order (e.g. city, state, zip for US, different elsewhere),
  • Validating fields on a field-by-field basis (e.g. between various postal code standards–depends on jQuery.validate),
  • Providing placeholder text for configured fields (helpful when validating above).

Deep Checkbox : jQuery Plugin for Nested Checkboxes

Deep Checkbox : jQuery Plugin for Nested Checkboxes

Imagine multidimensional list with checkboxes. They are nested in LI-elements (by the way, nesting is necessary for this plugin work).

Child-checkboxes are inherit parent’s property. Is possible to uncheck automatically checked items — that will exceptions. Also you can set element to display human-readable list of checked and excepted checkboxes there.

Leader.js : Inline form jQuery plugin

Leader.js : Inline form jQuery plugin

Leader.js is a concept to enable the user to fill a form as quickly and easily as possible on mobile.

Filling forms on mobiles can be frustrating, with constant scrolling, tapping and opening/ re-opening of the keyboard. Leader.js simplifies the process with a shake up of the process.

jQuery Step Form Wizard Plugin

jQuery Step Form Wizard Plugin

This jQuery plugin can generate step navigation for your purpose. You can use it for registration, settings, introduction or presentation of your projects.

jQuery highlightTextarea Plugin

jQuery highlightTextarea Plugin

highlightTextarea is a jQuery plugin which allows you to highlight words and sentences inside of <textarea> and <input> elements. Words are defined in a jQuery array and you can customize highlight color and case sensitivity. The highlighting updates itself when typing in the <textarea> and follows scroll and resizing (with jQuery-UI).

jQuery Multicomplete Plugin

jQuery Multicomplete Plugin

A quick and intuitive jquery plugin to show the most relevant results to your users.

Formance.js : jQuery Formatting and Validating Form fields Plugin

Formance.js : jQuery Formatting and Validating Form fields Plugin

Formance.js is a jQuery library for formatting and validating form fields, based on / inspired by Stripe’s jQuery.payment library.

Client side validation is not sufficient in any project because the javascript can be bypassed and people can submit requests directly to the server. However, that doesn’t mean client side validation should be forgotten. This library is for those who care about the user experience.



Best jQuery websites design awards