Для стилизации полей и выпадающих списков у них должен присутствовать класс field.

При изменении через javascript любых состояний полей (disabled, checked, selected) для поля надо вызвать событие refresh: $('#id').trigger('refresh'). Это необходимо делать для актуализации внешнего вида.

Для валидации форм используетcя плагин jquery.validate.js. Для того чтобы она работала всё что необходимо - поставить класс js-validate для тега form и прописать для полей в атрибутах правила валидации.

В случае загрузки элементов через ajax инициализировать ВСЕ скрипты вёрстки можно вызвав функицию initJS($('#element'));, где $('#element') это контейнер, куда произошла загрузка.

Inputs & Textarea

Text

Text disabled

E-mail

Telephone

File

File with placeholder

Password

Date

Date whit min=15.02.2019

Dates range

from to

Date inline

Time

Textarea

Select & Multiselect

Select

Select with search

Select with placeholder

Select disabled

Select with groups

Select multiple

Number & Count

Number

Count

Count with min=1

Count with max=3

Count with min=2 & step=3

Slider & Range

Slider with max=10

Slider with max=10 & legend=true

Slider range with min=3 & max=20

Slider range with min=5 & max=38 & step=3 & legend=4

Slider range with fixed min

Slider range with fixed max & one input

Fields range

Inputs range

Inputs range with labels

from to

Fields list & checkboxes

Checkbox
Checkbox checked
Checkbox disabled
Checkbox checked & disabled

Fields list inline & radiobuttons

Radio
Radio checked
Radio disabled
Radio checked & disabled

Buttons

Ссылка-кнопка Ссылка-кнопка disabled

Всплывающие окна

Для всплывающих окон используем конструкцию:

<div class="modal" id="sample">
    <div class="modal-container">
        <div class="modal-content">
            <a class="modal-close js-modal-close" href="javascript:{}">×</a><!-- Не обязательный элемент -->
            <div class="modal-title">Заголовок окна</div><!-- Не обязательный элемент -->
            <!-- Содержимое всплывающего окна -->
        </div>
    </div>
</div>

Для вызова окна просто создаём ссылку на него с классом js-modal в виде:

<a class="js-modal" href="#sample">Открыть окно #sample</a>

Соответственно чтобы открыть окно - надо эмулировать нажатие на эту ссылку.

Чтобы создать кнопку закрытия окна - внутри него необходимо создать ссылку с классом js-modal-close.

Заголовок h1 или .h1