Unobtrusive validation и загрузка форм через аякс (full ajax website)

При использовании «ненавязчивой» (unobtrusive) валидации форм в MVC проекте можно заметить, что если валидируемая форма была подгружена асинхронно, то валидация не сработает.

Поэтому после обновления частей страницы, содержащих формы, надо не забывать выполнить что-нибудь подобное:

$.validator.unobtrusive.parse($("#loadedContent"));

(где #loadedContent — это айдишник подгруженной области).
В простейшем случае можно даже добавить этот код в обработчик события ajaxSuccess, чтобы уж точно не забыть :)

$.ajaxSuccess(function(e) { $.validator.unobtrusive.parse(document); });

P.S. Заметить факт неработоспособности клиентской валидации может с легкостью помешать принцип graceful degradation — по-умолчанию валидация отработает нормально, но это будет серверная валидация :) При тестировании на localhost это и правда можно не заметить.

Традиционный пример проекта с этой небольшой функцией.

Опубликовать в Facebook
Опубликовать в Google Plus

6 комментариев

  1. Добрый!

    Артур, подскажите pls , у вас работает данная конструкция?

    $.validator.unobtrusive.parse($(«#loadedContent»));

    у меня почсему то не работает проверка для подгруженного контента…

  2. $(«#loadedContent»)
    здесь под #loadedContent подразумевается айдишка элемента, который подгружается аяксом.

    В моём случае это работает, при необходимости могу запостить простенький тест-проект.

    Если не работает с айдишкой можно попробовать выполнить $.validator.unobtrusive.parse(document);
    На всякий случай повторюсь, что этот js-код должен выполняться уже после подгрузки новой аяксовой части

  3. Спасибо за ответ, да это вполне логично что после загрузки)…
    ага я так тоже пробывал
    $.validator.unobtrusive.parse(document);
    не получилось.
    ни как не могу понять в чем трабл, уже начал перелопачивать unobtrusive.js.
    если не затруднит был бы признателен за тест-проект.
    спасибо Артур

  4. Пример добавил, можно экспериментировать с комментированием строчки
    $.validator.unobtrusive.parse($(«#testdiv»));
    чтобы посмотреть, как это отразится на результате

  5. подключать такую валидацию необходимо на основной странице или в подгружаемой странице?

  6. На подгружаемой. Важно, чтобы javascript отработал при уже обновленном блоке на странице.

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

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