Команда Oracle JET не рекомендует и не поддерживает интеграцию JET в ADF Faces. Этот пост основан на моем собственном исследовании и не отражает лучшие практики, рекомендованные Oracle. Если вы хотите попробовать то же самое — делайте это на свой страх и риск.
При всем при этом я по-прежнему считаю важным поиск путей дальнейшей интеграции JET в ADF Faces. Следующим шагом будет реализация компонента на основе JET с редактируемой сеткой и его интеграция в ADF для улучшения быстрого ввода пользовательских данных. Сегодня основное внимание уделяется интеграции составных компонентов JET только для чтения в ADF Faces. Рекомендую прочитать мои предыдущие посты на похожую тему, сегодня использую методы описанные в этих постах:
1. Компонент JET Composite — JET 4.1.0 Composite — действие элемента списка и отложенная загрузка
2. Интеграция JET и ADF — Улучшенный рендеринг JET в ADF
Вы можете получить доступ к исходному коду приложения ADF и JET Composite Component в моем репозитории GitHub — jetadfcomposite.
Начнем с пользовательского интерфейса. Я реализовал приложение ADF с регионами. Один из регионов содержит JET Composite. Существует запрос ADF, который отправляет результат в JET Composite. Существует интеграция между JET Composite и ADF — при нажатии на ссылку в JET Composite — форма ADF обновляется и отображает текущую строку, соответствующую выбранному элементу в JET Composite. Список слева рендерится из серии компонентов JET, компонент реализует один элемент списка:
Как видите, есть два вызова типов:
- ADF Query отправляет результат и JET Composite. ADF -> JET вызов
- JET Composite заставляет форму ADF отображать данные строки для выбранного элемента.
JET -> вызов ADF Очень важно отметить — JET Composite получает данные непосредственно из привязок ADF, здесь нет слоя REST. Это значительно упрощает реализацию JET в ADF Faces. В чем преимущество использования JET Composite в ADF Faces? Ответ — улучшена производительность на стороне клиента. Например, этот компонент позволяет расширить товар. Такое действие в чистом компоненте ADF Faces вызовет запрос к серверу. В то время как в JET это происходит на клиенте, так как обработка выполняется в JS:
При раскрытии элемента вызов на сервер не выполняется:
Готово — JET Composite хорошо работает с геометрией ADF Faces. В этом примере JET Composite находится внутри разветвителя панели ADF. При изменении размера Panel Splitter размер пользовательского интерфейса JET Composite также изменяется, так как он изначально адаптивен. Еще одно преимущество использования JET Composite в пользовательском интерфейсе ADF Faces:
Когда в JET Composite нажимается ссылка «Открыть» — выполняется вызов JS, и через ADF Server Listener мы обновляем текущую строку в ADF на соответствующие данные. Это показывает, как мы можем отправлять события из JET Composite в ADF Faces:
Он работает для перехода в другой регион:
И вернитесь — содержимое JET отображается нормально даже после выполнения PPR ADF Faces (для этого требуется простой трюк, см. Ниже). Если мы изучим исходный код страницы, мы увидим, что каждый элемент JET Composite проставлен в HTML в HTML-структуре ADF Faces:
Самое замечательное, что JET Composite, работающий в JET, не требует никаких изменений для запуска в ADF Faces. В моем примере я только добавил скрытое значение поля ID в JET Composite, чтобы иметь возможность передать его в ADF для установки текущей строки позже:
Я должен дать пару советов относительно инфраструктуры. Копировать код JET Composite напрямую в приложение ADF неудобно. Удобнее завернуть JET-код в JAR и таким образом прикрепить его к ADF. Для этого я бы рекомендовал создать пустой веб-проект в JDEV, скопировать код JET Composite туда (в папку public_html) и собрать из него JAR:
Поместите все содержимое JET в JAR:
Если веб-проект находится в основном приложении ADF, обязательно используйте рабочие наборы и отфильтруйте их, чтобы избежать их включения в EAR в процессе сборки:
Теперь вы можете добавить JAR с JET в приложение ADF:
Чтобы ресурсы JET HTML/JS были доступны из файла JAR, обязательно добавьте необходимую конфигурацию в основной файл web.xml приложения ADF. Добавьте сервлет ресурсов ADF, если он еще не добавлен:
Добавьте отображение сервлета, это позволит загружать содержимое из библиотеки JAR ADF:
Чтобы загрузить такие ресурсы, как JSON, CSS и т. д., из JAR ADF, добавьте фильтр библиотеки ADF и перечислите все расширения, которые нужно загрузить из JAR:
Добавьте сопоставление фильтров диспетчера FORWARD и REQUEST для фильтра библиотеки ADF сверху:
Как я упоминал выше, JET Composite визуализируется напрямую с данными привязок ADF, без вызова какой-либо службы REST. Это упрощает реализацию JET Composite в ADF Faces. Он просто визуализируется через итератор ADF Faces. Свойства JET Composite назначаются с помощью выражений ADF Faces EL для получения данных из привязок ADF:
JET несовместим с запросом/ответом ADF PPR. Если JET-контент включен в ответ ADF PPR — контекст повреждается и больше не отображается. Чтобы преодолеть это, мы перерисовываем контекст JET, если он был включен в ответ PPR. Это не перезагружает модули JET, а просто перерисовывает пользовательский интерфейс. В моем примере ADF Query отправляет запрос PPR в область, где JET Composite отображает результат. Я переопределил прослушиватель запросов:
Другие методы, где PPR генерируется для JET Composite — переключатель вкладок и ссылка «Дополнительно», которая загружает больше результатов. Все эти действия переопределяются для вызова методов в bean-компоненте:
Вызывается метод reDrawJet, который вызывает простой служебный метод для вызова JS-функции, которая фактически перерисовывает JET UI:
Перерисовка пользовательского интерфейса JET происходит в функции JS, которая очищает узлы Knockout.JS и повторно применяет текущие привязки модели JET:
JET -> вызов ADF осуществляется через JET Composite. Это событие назначается функцией JS, реализованной в контексте ADF Faces. Это позволяет вызывать JS, расположенные в ADF Faces, без изменения кода JET Composite. Я использую обычный прослушиватель сервера ADF для инициации JS -> вызов на стороне сервера:
Прослушиватель сервера ADF прикреплен к общей кнопке в ADF Faces:
Слушатель сервера ADF выполняет свою работу и применяет полученный ключ для установки текущей строки в ADF. Что автоматически запускает форму ADF для отображения правильных данных:
Первоначально опубликовано на сайте andrejusb.blogspot.com 6 декабря 2017 г.
