← Назад в «Блог»
678
Обновлено: 27 июля 2020

Проверка при заказе товара

Расскажу о задаче, которая возникла на рабочем проекте. Не буду вставлять участки кода, вам это будет вряд ли интересно.

Ближе к делу

В детальной карточке товара, в некоторых товарах присутствует возможность выбрать цвет и размер товара. Размеры появляются только тогда, когда выбран цвет, они подбираются из базы данных в зависимости от цвета.

Изначально, у меня была проверка на выбранный цвет и размер. Без этого нельзя было купить товар. При нажатии на купить без выбранного размера или цвета, показывалось сообщение «Выберите цвет или размер».

Товары разные, в некоторых были только цвета, в других были только размеры. Формулировка «Выберите цвет или размер» не очень-то подходила.

На тот момент я сделал так, потому что были задачи важнее, я запомнил недочет и собирался вернуться и все поправить.

Уведомление об отсутствии товара на складе.

От заказчика поступила задача, при увеличении количества товара, если такого количества нет, показывать пользователю уведомление об этом.

Поле для ввода количества

Мои коллеги вывели для меня на странице оставшееся количество товара, которое я смог использовать и показывать уведомление.

Показ уведомления при отсутствии товара на складе

Проверка на цвет и размер

Первая задача решена. Но осталось недоработка с подсказками для цвета и размера.

Дело в том, что помимо подсказки отдельно про цвет и размер, нужно было запретить пользователю выбирать количество, если не выбран цвет или размер. Иначе как я буду проверять остаток на складе?

Сделал блок с количество полупрозначным и неактивным

Итак, я отключил возможность увеличивать или уменьшать количество товара. Вместо этого я подсказываю пользователю, что ему нужно делать, чтобы выбрать количество и купить товар.

Цвет не выбран, нажали на количество или кнопку «Купить» — уведомление «Выберите цвет».

Цвет выбран, нажали на количество или кнопку «Купить» — уведомление «Выберите размер».

Иногда запросы в базу данные на размер бывают долгими, и цвета не появляются по 5 секунд. Что пользователь подумает об этом? — «Сайт не работает». Не порядок.

Я сделал еще одну проверку и если размеры еще не загрузились, показываю уведомление о том, что размеры загружаются, подождите немного.

Супер! Теперь пользователь будет знать что сайт работает, а сайт ищет в базе данных размеры по этому цвету.

Если же все поля были выбраны верно, то есть и цвет и размер — товар успешно попадает в корзину.

Полезно
1
Непонятно
Поделиться
Отправить
Линкануть
Вотсапнуть

Канал Дани в телеграме

В канале показываю, как разрабатываю продукты: нейронки, боты, пет-проекты, бизнес. Делюсь фишками о разработке и дизайне. Без рекламы.

Подписаться
← Назад в «Блог»

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Контакты