Advanced Forms | Porto Admin - Responsive HTML5 Template 1.4.1

- 3
- 4
- 3

John Doe Junior administrator

## Advanced Forms

## Select Replacement

Basic select
Multi-Value Select
Placeholders
Minimum Input

## Multi-select

Basic Multi-select
Basic Multi-select (Only One)
With Preselected Options
Link button
With icon
Select All Option
With Search
Toggle All Button

## Tag Autocomplete

Input Tags

Just add `data-role="tagsinput"` to your input field to automatically change it to a tags input field.

True multi value

Use a `<select multiple />` as your input element for a tags input, to gain true multivalue support. Instead of a comma separated string, the values will be set in an array. Existing `<option />` elements will automatically be set as tags. This makes it also possible to create tags containing a comma.

## Toggle Switches

Large
Default
Small

## Slider Range

One Value

The current `value` is: 50

Range

The `min` is: 25 and the `max` is: 75

## Spinners

Default Spinner
Disabled
Horizontal buttons

with `max` value set to 10

Alternative

with `step` set to 5

## Masked Inputs

Input masks allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phones, etc).

Date
Phone
Product Key
SSN

## Date Picker

Default Datepicker
Date range
to
Multiple dates
Inline

## Time Pickers

Default Time Picker
24 Hour Mode Time Picker
Specify a step for the minute field

## Color Pickers

Default
RGBA
Horizontal
Component
Button
Select color

## MaxLength Control

Input

`max-length` set to 20.

Textarea

`max-length` set to 140.

## Bootstrap Confirmation

Basic Confirmation
Click me
Confirmation with Callbacks
Click me

## File Upload Drag'n Drop

## WYSIWYG Editors

Summernote
Start typing...

## Markdown Editor

Bootstrap Markdown
### Hello there How are you? I have bellow task for you : Select from this text... Click the bold on THIS WORD and make THESE ONE italic Link GOOGLE to google.com Test to insert image (and try to tab after write the image description) Test Preview And ending here... Click "List" Enjoy!