Form Plugins

Anythings that related to form...
X-editable
Simple text field {{ user.name || "superuser" }}
Empty text field, required {{ user.family || 'empty' }}
Select, local array, custom display {{ showStatus() }}
Select, remote array, no buttons {{ user.groupName || 'not set' }}
Remote validation with error {{ user.name || 'empty' }}
Datepicker (Html 5) {{ user.date || 'empty' }}
Range (Slider) {{ user.range || 'empty' }}
TimePicker {{ (user.time | date:"HH:mm") || 'empty' }}
Textarea, buttons below.
{{ user.desc || 'no description' }}
Twitter typeahead.js {{ user.state || 'empty' }}
Checklist {{ showFruit() }}
Radio List {{ showGender() }}
Editable row
To create editable row in table you should place editable elements in cells with e-form attribute pointing to form's name. The form itself can appear later (e.g. in last column) but it will work. Don't forget to add editable-form attribute to the form.
Name Status Group Edit
{{ user.name || 'empty' }} {{ showStatus(user) }} {{ showGroup(user) }}
File Input
Select fileChange Remove


...
Select imageChange Remove
Date Picker (Jquery UI)
Bootstrap Timepicker
Clockpicker
Color Pickers
Jasny Input Masking

USAGE: <input type="text" data-mask="99/99/9999" data-placeholder= "-">

Input Masking made easier!

Data format **/**/****

Data format (XXX) XXX-XXXX

Data format ****-****-****-****

Data format ***-***-***-***-***-***

Data format 99-9999999

Standard Select
Select 2

Usage: <select style="width:100%" class="select2" ">...</select>

Usage: <select multiple style="width:100%" class="select2" >...</select>

Tags