0

На странице имеется форма добавления информации о себе, которая отправляется на сервер Ajax'м. При успехе на страницу возвращается alert уведомление. Если нажать снова кнопку "Отправить", эта форма повторно добавится в БД и так далее. Что можно в этом случае сделать?

1
  • Важность дисаблить кнопку в том, что юзер не нажмет на нее больше одного раза, даже если это вышло случайно. С точки зрения UX кнопок с дизаблем не должно быть быть. Так что попробуйте пробуйте удовлетворить все свои хотелки и юзера.
    – VasyOk
    20 ноя 2014 в 13:29

2 ответа 2

2

На выбор:

  1. После нажатия на кнопку "отправить" блокировать ее до получения ОТРИЦАТЕЛЬНОГО ответа от сервака или редактирования формы.

  2. После успешной отправки очищать форму.

  3. После отправки переводить форму из состояния create в состояние update.

  4. Проверять дубликаты в бд при добавлении.

  5. Редиректить на страницу просмотра добавленной записи, а уже там выдавать сообщение.

Есть еще пара способов, типа передавать уникальный код транзакции, чтобы наверняка определить отправку одних и тех же данных, но они сложнее в реализации.

1

От хороших идей к худшим:

  • скрыть форму;
  • выполнить reset для формы;
  • установить disabled = true для кнопки type="send" после отправки, и в случае ошибки disabled = false;
  • установить disabled = true для кнопки type="send" после успешного получения ответа;
  • проверять дублирование данных.

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

1
  • Проверку на дублирование любые манипуляции с UI не отменяют ИМХО. Мало ли что пользователь намудрит. Любой, у кого есть мозг и кто может нажать на F12 в хроме, сможет заново включить кнопку.
    – sinedsem
    20 ноя 2014 в 14:12

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.