🏠 返回首頁 

Greasy Fork is available in English.

Form Field Saver and Validator

Сохраняет значения полей формы в localStorage, восстанавливает их при загрузке страницы, проверяет обязательные поля перед отправкой и визуально обновляет состояние кнопок.


Установить этот скрипт?
Автор
DevPostnov
Установок в день
0
Всего установок
1
Оценки
0 0 0
Версия
1.2
Создано
26.02.2025
Обновлено
26.02.2025
Размер
10,2 КБ
Лицензия
MIT
Работает на

# Form Field Saver and Validator

## Описание
Этот пользовательский скрипт улучшает работу с формами на страницах оплаты или заказа. Он выполняет следующие функции:

- **Сохранение и восстановление данных**: Введённые значения обязательных полей сохраняются в `localStorage` и восстанавливаются при повторной загрузке страницы. Это предотвращает потерю данных при случайном обновлении или закрытии браузера.
- **Проверка обязательных полей**: Перед отправкой формы скрипт проверяет, заполнены ли все обязательные поля. Если есть пустые поля, отправка формы блокируется, страница прокручивается к первому пустому полю, и оно выделяется визуально.
- **Обновление состояния кнопок**: Кнопки отправки формы становятся полупрозрачными, если есть незаполненные поля, но остаются кликабельными, чтобы пользователь мог получить обратную связь о проблеме.
- **Стилизация**: Скрипт включает CSS-стили для улучшения внешнего вида формы и её элементов.

## Установка
1. Установите расширение для браузера, поддерживающее пользовательские скрипты, например [Tampermonkey](https://www.tampermonkey.net/).
2. Нажмите "Создать новый скрипт" в Tampermonkey и вставьте предоставленный код.
3. В метаданных скрипта замените `https://example.com/*` в `@match` на URL страницы, где используется ваша форма.
4. Сохраните скрипт.

## Использование
- Скрипт автоматически сохраняет значения полей при их изменении.
- При загрузке страницы восстанавливает ранее введённые данные.
- Если вы пытаетесь отправить форму с незаполненными полями, страница прокрутится к первому пустому полю, и оно будет подсвечено.
- Кнопки отправки визуально показывают, можно ли отправить форму, но остаются активными для проверки.

## Настройка
- **Обязательные поля**: Список полей в массиве `requiredFields` можно изменить под вашу форму. Текущие поля:
- `textarea[name="paid_content"]`
- `input[name="customer_email"]`
- `input[name="products[cur_1][price]"]`
- `input[name="products[cur_1][name]"]`
- **Стили**: Стили можно настроить, отредактировав переменную `styles` в коде.

## Зависимости
- Скрипт использует jQuery, который подключается через `@require` из CDN (`https://code.jquery.com/jquery-3.6.0.min.js`).

## Примечания
- Убедитесь, что селекторы кнопок (`#btnPay-wrapper button, .dropdown-menu button`) и формы (`form`) соответствуют структуре вашей страницы. При необходимости измените их в коде.
- Перед публикацией протестируйте скрипт на целевой странице.