На странице имеется форма добавления информации о себе, которая отправляется на сервер Ajax'м. При успехе на страницу возвращается alert уведомление. Если нажать снова кнопку "Отправить", эта форма повторно добавится в БД и так далее. Что можно в этом случае сделать?
-
Важность дисаблить кнопку в том, что юзер не нажмет на нее больше одного раза, даже если это вышло случайно. С точки зрения UX кнопок с дизаблем не должно быть быть. Так что попробуйте пробуйте удовлетворить все свои хотелки и юзера.– VasyOk20 ноя 2014 в 13:29
2 ответа
На выбор:
-
После нажатия на кнопку "отправить" блокировать ее до получения ОТРИЦАТЕЛЬНОГО ответа от сервака или редактирования формы.
-
После успешной отправки очищать форму.
-
После отправки переводить форму из состояния create в состояние update.
-
Проверять дубликаты в бд при добавлении.
-
Редиректить на страницу просмотра добавленной записи, а уже там выдавать сообщение.
Есть еще пара способов, типа передавать уникальный код транзакции, чтобы наверняка определить отправку одних и тех же данных, но они сложнее в реализации.
От хороших идей к худшим:
- скрыть форму;
- выполнить
rese
t для формы; - установить
disabled = true
для кнопкиtype="send"
после отправки, и в случае ошибкиdisabled = false
; - установить
disabled = true
для кнопкиtype="send"
после успешного получения ответа; - проверять дублирование данных.
Но идеально будет дисаблить кнопку после нажатия, если возникнит ошибка раздисаблить, если успешно, скрыть форму и показать типа "спасибо" или что вы там в алерте выводите.
-
Проверку на дублирование любые манипуляции с UI не отменяют ИМХО. Мало ли что пользователь намудрит. Любой, у кого есть мозг и кто может нажать на F12 в хроме, сможет заново включить кнопку.– sinedsem20 ноя 2014 в 14:12