WedX - журнал о программировании и компьютерных науках

ZF2 - проверка в модальном режиме начальной загрузки

Я использую twitter bootstrap в приложении zf2. Модальное окно начальной загрузки отображает форму, содержащую данные пользователя, которые я хотел бы отредактировать и сохранить. Это довольно тривиально, если я просто отправляю форму в диалоговом окне и перезагружаю всю страницу, но я ищу способ проверить форму без ее отправки, и в идеале, если данные действительны, чтобы он передал новые данные обратно на страницу при закрытии модального диалога.

Как я могу это сделать - это должен быть вызов ajax? Если да, то как бы я структурировал это в моем контроллере, чтобы вернуть проверку формы таким образом, чтобы ошибки могли отображаться в модальном режиме?

Редактировать 1: Принятый ответ ниже до сих пор на месте.

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

Таким образом, простой рабочий процесс - модальное окно открывается загруженным с формой редактирования, привязанной к модели пользователя, которая показывает данные пользователя для редактирования (все они предварительно загружены и уже назначены для представления). Модальная форма отправляется, jquery подключается к отправке формы и отправляет данные в виде ajax-запроса в UserController::EditUserAction, где данные формы проверяются на соответствие входному фильтру моделей. Если оно оказывается действительным, данные сохраняются, а модальное диалоговое окно закрывается. Если данные недействительны, скажем, изменение адреса электронной почты на адрес, который уже существует, действие возвращает JsonModel с ошибками формы - как это затем передается в модальное окно начальной загрузки, чтобы выделить поле, вызвавшее ошибку, например так, как это делает ZF автоматически, когда форма обычно отправляется?

twitter-bootstrap zend-framework2
15.03.2014

Ответы:


1

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

<script>
$(function() {
  jQuery.ajax({
    type: method,
    dataType: 'json',
    url: url,
    data: data,
    error: function(jqXHR, textStatus, errorThrown) {
      // Do something to handle the error
    },
    success: function(data, textStatus, jqXHR) {
      // Do something else on successful validation
    }
  });
});
</script>

type — это метод HTTP (например, 'POST'). url — это путь к контроллеру, который даст вам ответ. data — это данные формы для отправки. Дополнительная документация находится по адресу https://api.jquery.com/jQuery.ajax/.

Функция успеха выполняется, если код ответа HTTP находится в диапазоне 200. Если вы отправите код ответа HTTP в 400 или 500, будет выполнен javascript в функции ошибки. Это можно использовать для отображения ошибки в вашем модальном диалоговом окне.

Вы можете изменить код ответа HTTP в контроллере, используя следующий код:

$this->getResponse()->setStatusCode(400);

где 400 — код ответа HTTP (см. https://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html для получения дополнительной информации о кодах ответов HTTP)

Затем, чтобы отправить данные обратно с ответом, верните JsonModel в контроллере вместо ViewModel

return new JsonModel($array);

где $array — это данные, которые вы хотите отправить обратно в браузер.

Если вы в конечном итоге делаете это часто, вы можете исследовать класс zf2 \Zend\Mvc\Controller\AbstractRestfulController.

15.03.2014
  • Итак, в моем контроллере я получаю связанный объект из формы, проверяю данные сообщения на соответствие входному фильтру объектов - тогда как я могу вернуть и заполнить ошибки/сообщения обратно в модальное окно начальной загрузки, не закрывая его? 16.03.2014
  • @Джон, не стесняйтесь добавлять фрагмент кода или два. Я не знаю, спрашиваете ли вы, как это сделать с контроллера (zf2) или в браузере с javascript. Однако, поскольку вы, вероятно, уже следовали моему указанию, возможно, вы успешно отправили сообщение об ошибке с контроллера в браузер. В этом случае вам может потребоваться просто удалить атрибут data-dismiss="modal" из <button type="button" class="btn btn-default" data-dismiss="modal">Submit</button> в модальном диалоговом окне, чтобы гарантировать, что нажатие кнопки не закроет модальное диалоговое окно. 16.03.2014
  • Пока отличная помощь, я добавил немного больше информации о том, где я застрял 21.03.2014
  • Джон, если бы я мог получить немного больше информации, это было бы полезно. В частности, если бы я мог увидеть какой-то код в конце вашего контроллера и/или если бы я мог увидеть ответ http, это было бы здорово. Вы можете получить http-ответ, открыв Chrome Dev Tools, щелкнув вкладку «Сеть», щелкнув make запроса ajax, а затем щелкнув вкладку «Ответ». Разумеется, чтобы увидеть эту информацию, страница не должна обновляться после получения ответа браузером. 21.03.2014

    • 2

    если вы хотите попробовать пройти проверку перед отправкой формы (отправить данные на сервер). может быть лучше использовать проверку на стороне клиента.

    https://www.rayfaddis.com/blog/2013/05/27/jquery-validation-with-twitter-bootstrap

    15.03.2014
  • Спасибо, но я действительно не хочу дублировать все свои правила проверки - они уже определены в моем коде модели, который я хотел бы использовать, я просто не уверен, как вернуть информацию о проверке из контроллера обратно в загрузчик модальный. 16.03.2014
    • Новые материалы
    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..
    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..
    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..
    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..
    Учебные заметки: создание моего первого пакета Node.js
    Это мои обучающие заметки, когда я научился создавать свой самый первый пакет Node.js, распространяемый через npm. Оглавление Глоссарий I. Новый пакет 1.1 советы по инициализации..
    Забудьте о Matplotlib: улучшите визуализацию данных с помощью умопомрачительных функций Seaborn!
    Примечание. Эта запись в блоге предполагает базовое знакомство с Python и концепциями анализа данных. Привет, энтузиасты данных! Добро пожаловать в мой блог, где я расскажу о невероятных..
    ИИ в аэрокосмической отрасли
    Каждый полет – это шаг вперед к великой мечте. Чтобы это происходило в их собственном темпе, необходима команда астронавтов для погони за космосом и команда технического обслуживания..
    Для любых предложений по сайту: [email protected]