Как использовать WTForms в проверке Ajax?

Question

Я привык использовать WTForms с помощью Flask-WTF в своем приложении для колб. Проверка на стороне сервера тривиальна. Но как мне использовать эту проверку сервера, чтобы стать полевым уровнем, ajax, проверкой на стороне клиента? Таким образом, когда пользователь вкладывает в другие поля ввода, мое приложение может непосредственно продолжать его проверку и выдавать предупреждение о подтверждении / информация / ошибка.

Я еще не нашел ресурс в интернете

Answer 1

Возможное решение заключается в следующем:

• На стороне клиента вы прикрепляете обработчик к blur событие во всех элементах управления в форме.

• Каждый раз, когда происходит событие размытия, вы запускаете функцию Javascript, которая собирает значения всех полей и затем отправляет их как запрос POST ajax.

• На сервере функция представления, которая обрабатывает этот запрос POST ajax, создает форму Flask-WTF и затем проверяет ее. Любые ошибки, возникшие в результате проверки, собираются в словарь, который затем отправляется в ответ JSON обратно клиенту.

  Например, успешная проверка может вернуть следующий JSON:

  { 
      "errors": {}
  }
  

  Ответ, который включает ошибки, может быть:

  {
      "errors": { 
          "name": "This field is required",
          "age": "Enter a numeric value between 0 and 99"
      }
  }
  

• Клиент получает этот ответ JSON и применяет необходимые изменения в DOM для выявления ошибок.

• Если вы получили новое событие размытия до того, как вернулось предыдущее, вы, вероятно, захотите прервать ожидающий POST ajax и запустить новое с обновленными значениями полей. У вас должен быть только один ожидающий запрос на проверку, чтобы избежать условий гонки.

Answer 2

Отличный вопрос. Вот что мы делаем (бэкэнд-колба, внешний интерфейс jquery):

• использовать плагин jquery.forms для форм ajax. Довольно солидный зрелый код. Недостаток: невозможно отправить данные в кодировке json, только в формате urlencoded. Получает обычные или JSON данные.
• используйте wtfroms для проверки формы. Очень зрелая кодовая база.
• пытался использовать wtforms-json для принятия json, очень странные проблемы.