50 form functions, validation, security, and custom jquery plug-ins

Source: Internet
Author: User
Tags time and date

50 jquery plugins for form functionality, validation, security and customisation

To be honest, entering a form is always a pain point. What about developers? You can create a form to say they are more painful. No one will really like them. For developers, the most difficult challenge when it comes to form development is not just to create a simple and fast application for users, however, it must be as convenient and usable as possible. This is indeed quite difficult.

In this article, we have collected 50 jquery plug-ins to help you build powerful forms. If you encounter any form solution in the future, you will find your jquery solution here.

Form function plug-in elastic-Make your textareas grow

This jquery plug-in allows you to increase or decrease the form field of textareas to adapt to its content. It was inspired by Facebook's textareas domain.
Elastic-Make your textareas grow»

Jquery "Highlight" plugin

The highlighted area improves the form availability and highlights the interaction elements on the page. It is mainly used in forms, but it can also be used in tables, lists, or any element you specify.
Jquery "Highlight" plugin»

Autotab: jquery auto-tabbing and filtering

Autotab is a jquery plug-in that provides automatic switching and filtering of text fields in form fields. Once the entered string reaches the defined text length, it automatically switches to the automatically set target element.
Autotab: jquery auto-tabbing and filtering»

Ajax fancy CAPTCHA

Ajax fancy CAPTCHA helps you protect your pages from attacks by robots and spam senders through new pages. It is only achieved through user-friendly verification. This is achieved by dragging a specified item to a circle.
Ajax fancy CAPTCHA»

Jquery noblecount

Noblecount dynamically displays the number of remaining characters in the textarea domain in this article, Twitter style.
Jquery noblecount»

Password strength indicator and Generator

The password strength indicator and generator plugin allows you to set the element class, so that you can visually display the password strength.
Password strength indicator and generator»

Formtowizard plugin

The formtowizard plug-in allows you to submit form information in the "left-by-order" step.
Formtowizard plugin»

Sliding labels-jquery form plugin

Sliding labels-jquery form plugin»


Toggleval will allow you to fill in form text fields in different ways (in some different ways), and automatically switch to the default value when receiving and losing focus.

Jquery alphanumeric

Jquery Alphanumeric is a javascript control plugin that allows you to limit what characters a user can enter on textboxes or textareas.
Jquery alphanumeric»

Form encyription and password security jcryption

Jcryption is a javascript HTML-form encryption plugin, which encrypts the post/get data submitted by forms.
Normally, when you submit a form, data will be sent in plain text if nossl is used. but SSL is not supported by every webhost nor it's easy toinstall/apply at times. so in this situation the jcryption plugin helps you to encrypt your data with your.

Password validation plugin

This pluginoffers a function that rates passwords for factors like mixedupper/lower case, mix of characters (digits, special characters), length and similarity to a username (optional) and gives a custommethod for the validation plugin that uses the rating function to display a password strength meter, requiring the field to have a "good" rating.
Password validation plugin»

Password strength-estimates brute force time

Password strengthtries to calculate how your possibilities the hacker needs to try toguess your password. It makes the assumption that it is possible totest 2800 million passwords per second.
Password strength»

Password Strength Meter v2

The password strength meter works by presenting a global variable score and at the end of the algorithm the plugin will decide the passwords strength according to the score value.
Password Strength Meter V2»

Form mask plugin masked input plugin

The masked input pluginallows a user to easily enter fixed width input fields where you wouldlike them to enter the data in a certain format (dates, phone numbers, etc ).
Masked input plugin»

Autonumeric ()

Autonumeric () is a flexible international numeric formatter, that will automaticallyplace a thousand separator as you type and supports nine differentrounding methods.
Autonumeric ()»

Form upload plugins Ajax upload

Ajax uploadallows you to easily upload multiple files without refreshing the pageand can use any element to show the file selection window.
Ajax upload»

Jquploader: jquery plugin for file upload and progressbar

Jquploader is a pluginthat substitutes the HTML file input fields with a flash-based fileupload widget, allowing you to display a progressbar and percentage.


Uploadify is a pluginthat allows the easy integration of a multiple (or single) file uploadson your website. it requires Flash and any backend developmentlanguage. an array of options allow for full customization for advancedusers, but basic implementation is so easy that even coding novices cando it.

Jquery uploadprogress plugin

This pluginwill augment a standard file upload form with a transparent backgroundupload and add a progress meter that will keep you graphically informed.
Jquery uploadprogress»

Form skinning and customisation jquery checkbox

The jquery checkbox plugin is a lightweight custom styled checkbox implementation that can also work with radio buttons.
Jquery checkbox»

Jqtransform-jquery form plugin

This plugin is a jquery styling plugin which allows you to skin form elements with relative extensions.

In-field labels jquery plugin

This is a simple pluginthat turns properly formatted HTML forms into forms with in-field labelsupport. labels fade when the field is focussed and disappear when textentry begins. clearing a field and leaving brings back the label.
In-field labels jquery plugin»


Niceformsis a script that will replace the most commonly used form elements withcustom designed ones. You can either use the default theme that isprovided or you can even develop your own look with minimal effort.


Jnicemakes it easy to style rough and simple HTML forms into beautiful webforms, checkboxes, input elements and selectboxes by creating customlooking form elements, that function just like normal form elements.

Uniform-sexy forms with jquery

Uniformmasks your standard form controls with custom themed controls. It worksin sync with your real form elements to ensure accessibility andcompatibility.


Prettycheckboxesis for developers who wants to maintain a consistent style forcheckboxes should SS all browsers. By using this script you wont loose anyregular input usability.

Form select and combo boxes jquery. ComboBox

Jquery. ComboBox is an unobtrusive way of creating a HTML type ComboBox from a existing HTML select element (s ).
Jquery. ComboBox»

Javascript image ComboBox

The fully skinnable image ComboBox plugin allows you to add an icon with each option that works with your existing "select" element.
Javascript image ComboBox»

Selectbox plug-in

Selectbox plug-in»

Two sided multi Selector

This pluginconverts a multi select list into a two-sided multi-select list. thismeans you display a list of options in the left hand box and items youselect are moved into the right hand box.
Two sided multi selector»


Flexselecttakes the select box, and creates a hidden input element to track theassociated value and creates a text input for the selection. it usesthe liquidmetal Scoring Algorithm to narrow the selection.

Form time and date pickers jquery. timepickr. js

Jquery. timepickr. js has been developed in a attempt to make the process of inputing time in a form as easy and natural as possible.
Jquery. timepickr. js»


Datepicker is a feature rich and easy to customize plugin that allows for single, multiple or range selection dates.

Jquery datepicker

This is a clean, flexible and unobtrusive plugin for jquery which allows you to easily add date inputing functionality to your web forms and pages.
Jquery datepicker»

Jquery week calendar

The jquery week calendar pluginprovides a simple and flexible way of including a weekly calendar inyour application and has been authorized red by other online weekly calendarssuch as Google Calendar.
Jquery week calendar»

Form auto-suggest autosuggest

Autosuggest is a lightweight jquery pluginthat will dynamically create all the HTML elements that is neededfor turning any regular text input box into an auto-complete box.


By giving an autocompleted field focus or entering something into it, the pluginstarts searching for matching entries and displays a list of values tochoose from. by entering more characters, the user can filter down theList to better matches.

Ajax AutoComplete

Ajax autocompleteallows you to easily create AutoComplete/autosuggest boxes for textinput fields with every query result being cached and pulled from localcache for the same repeating query. if there are no results for aparticular query it stops sending requests to the server for otherqueries with the same root.
Ajax AutoComplete»

Facebook like-jquery and autosuggest Search Engine

Facebook like is a powerful jquery pluginthat transform an input field into a real time autocompletion searchengine, designed, as the name suggests, similiar to the one on Facebook.
Facebook likeplugin»

Form validation plugins A jquery inline Form validation, because validation is a mess

Whenan error needs to be displayed, this script creates a div and positionsit in the top right corner of the input. this way you don't have toworry about your HTML form structure. the rounded corners and shadowsare pure css3 and degrade well in non compliant browsers.


The validation plugin is one of the oldest jquery plugins (started in July 2006) available that has proved itself due to Reliabilty, because of use and extensive docs.

Highly customizable yet simple form Validation

With this highly customizable pluginthe user can set his own class to define the rule, set events onerrorand onvalid for a participant class and you can also add their owneffects, may be jquery animate ().
Highly customizable Form validation»

Livevalidation-validation as you type

Livevalidationis a small open source JavaScript library for making client-sidevalidation quick, easy, and powerful. it comprises of two main parts. firstly, it provides developers with a rich set of core validationmethods, which can also be used outside the context of forms. secondly, it provides your visitors with real-time validation information as theyfill out forms, helping them to get it right first time.

Ketchup plugin

Ketchup plugin is a slim jquery plugin that validates your forms. It aims to be very flexible and extendable for its appearance and functionality.
Ketchup plugin»

Jtip-The jquery tool tip

Jtippulls content into a tool tip Using the httpxmlrequest object. byadding A Class Attribute Value of "jtip" to a link element you cancreate A tooltip from the content found in the file the href ispointing too.

Jquery live Form validation

This plugin in helps you to easily create form validations with high flexibility and is a packaged with a huge set of options.
Jquery live Form validation»

Valid8-an input field validation plugin

Valid8solves both simple and complex validation scenarios. Everything from abasic required field to regular expressions, Ajax requests andarbitrary JavaScript Functions.
Valid8-an input field validation plugin»

Jval-jquery form field validation plugin

Jval is a jquery form field validation plugin that provides an appealing animated message flyout that doesn't impede form layout/design while being user-friendly.

The original jquery plugin jquery form plugin

And if all of the rest of the Plugins on this page can't help, you can always rely on the original jquery form Plugin: jquery form plugin»

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.