Form Components form components and widgets

Twitter Auto Complete(typeahead.js)

E.g: conquer, keenthemes.
Learn more: http://twitter.github.io/typeahead.js/

E.g: USA, Malaysia. Prefetch from JSON source

Uses a precompiled template to customize look of suggestion.

Two datasets that are prefetched, stored, and searched on the client. Highlighting is enabled.

View in Modal
Date Pickers
Select date
Select date
Select date
Select month only
to
Select date range
May 2025
SuMoTuWeThFrSa
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567
View Datepicker in modal
Datetime Pickers
December 2012
SuMoTuWeThFrSa
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
View Datetimepicker in modal
Time Pickers
View Timepicker in modal
Clockface Time Pickers
55
23
00
12
05
13
50
22
14
10
45
21
15
15
0-11
40
20
16
20
19
35
18
30
17
25
View Clockface Time Pickers in modal
Daterangepickers
  April 10, 2025 - May 9, 2025
Color Pickers
View colorpicker in modal
Select 2 Dropdowns

Fixed Width

.input-xlarge
.input-large
.input-medium
.input-small
.input-xsmall

Fluid Width

.col-md-4
.col-md-5
.col-md-6
.col-md-9

Advance Samples

  • No matches found
  • red
  • blue
View Select2 in modal
Multiple Select
  • Dallas Cowboys
  • New York Giants
  • Chicago Bears
  • Detroit Lions
  • Green Bay Packers
  • Minnesota Vikings
  • Carolina Panthers
  • New Orleans Saints
  • Tampa Bay Buccaneers
  • Arizona Cardinals
  • St. Louis Rams
  • San Francisco 49ers
  • Seattle Seahawks
  • Philadelphia Eagles
  • Washington Redskins
  • Atlanta Falcons
    • NFC EAST
    • Washington Redskins
    • Philadelphia Eagles
    • New York Giants
    • Dallas Cowboys
    • NFC NORTH
    • Minnesota Vikings
    • Green Bay Packers
    • Detroit Lions
    • Chicago Bears
    • NFC SOUTH
    • Tampa Bay Buccaneers
    • New Orleans Saints
    • Carolina Panthers
    • Atlanta Falcons
    • NFC WEST
    • Seattle Seahawks
    • San Francisco 49ers
    • St. Louis Rams
    • Arizona Cardinals
Bootstrap Switch
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
ONOFF
YesNo
10
 External  Internal 
 Enabled   Disabled 
TVOFF
ONSignal
ONOFF
ONOFF
ONOFF
View in Modal
Bootstrap Input MaxLength
Maxlength is 25 chars. The badge will show up by default when the remaining chars are 10 or less.
Maxlength is 25 chars. Do you want the badge to show up when there are 20 chars or less? Use the threshold option: threshold: 20
This is a complete example where all the options configured for the bootstrap-maxlength counter are setted. Please note: if the alwaysShow option is enabled, the threshold
Bootstrap maxlength supports textarea as well as inputs. Even on old IE.
The field counter can be positioned at the top, bottom, left or right. You can also place the maxlength indicator on the corners: bottom-right, top-right, top-left, bottom-left and centered-right. All you need to do is specify the placement option, with one of those strings.
Spinners
basic example
disabled state
with max value: 10
with step: 5
Bootstrap TouchSpin
$
basic example
%
example with decimal steps
Form Tools
Incorrect please try again

Enter the words above Enter the numbers you hear

Note: Please visit http://www.google.com/recaptcha to learn more about the Google reCaptcha

Check
Type a username(E.g: user1, user2) and check its availability.
Type a username(E.g: user1, user2) and check its availability on focus lost
Type a password to check its strength
IP Address Input
192.168.120.150
3ffe:1900:4545:3:200:f8ff:fe21:67cf
Input Masks
y/m/d
change the placeholder
multi-char placeholder
(999) 999-9999
99-9999999
mask "9" or mask "99" or ... mask "9999999999"
123456 => 鈧?___.__1.234,56
123456 => 鈧?___.__1.234,56(left aligned)
999-99-9999. remove the empty mask on blur or when not empty removes the optional trailing part
Tags Input
foo  xbar  xbaz  xroffle  x
tag1  xtag2  x
Advanced File Input
 
Select file Change Remove
Select file Change  
Select image Change Remove
NOTE! Image preview only works in IE10+, FF3.6+, Safari6.0+, Chrome6.0+ and Opera11.1+. In older browsers the filename is shown instead.
Select image Change Remove
NOTE! Image preview only works in IE10+, FF3.6+, Safari6.0+, Chrome6.0+ and Opera11.1+. In older browsers the filename is shown instead.
Bootstrap Markdown Editor

This is some editable heading

Well, actually all contents within this "markdown-editable" context is really editable. Just click anywhere!

Click above content to edit it
Fixed widthe set with data-width="400" html attribute
WYSIWYG Editors
2013 © Conquer by keenthemes.
May 2025
SuMoTuWeThFrSa
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567
December 2012
SuMoTuWeThFrSa
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
May 2025
SuMoTuWeThFrSa
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567
December 2012
SuMoTuWeThFrSa
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
December 2012
SuMoTuWeThFrSa
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
Today
December 2012
SuMoTuWeThFrSa
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
Today
May 2025
SuMoTuWeThFrSa
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567
Apr 2025
SuMoTuWeThFrSa
303112345
6789101112
13141516171819
20212223242526
27282930123
45678910
 
WMoTuWeThFrSaSu
182829301234
19567891011
2012131415161718
2119202122232425
222627282930311
232345678
WMoTuWeThFrSaSu
1431123456
1578910111213
1614151617181920
1721222324252627
182829301234
19567891011