Richfaces componentControl переключатель всплывающее окно - PullRequest
Новая
       13

Richfaces componentControl переключатель всплывающее окно

0 голосов
/ 09 февраля 2012

Мне бы хотелось, чтобы один элемент управления отображал rich: popupPanel, если он не виден, и скрывал его, если он уже виден.

Следуя инструкциям и примерам кода, я придумал: 

<h:outputLink value="#" id="loginLink">Login
    <rich:componentControl event="click"  operation="show" target="loginPane" >
        <a4j:param name="event" value="event" noEscape="true" />
        ... more params for positioning ...
    </rich:componentControl>
</h:outputLink>

<rich:popupPanel id="loginPane" autosized="true" modal="false" moveable="false" resizeable="false" followByScroll="false" onshow="#{rich:element('userName')}.focus()" >
    <h:form>
   ...
    </h:form>
</rich:popupPanel>

Что хорошо показывает мою всплывающую панель и последующую форму. Я просто не могу распознать способ перезагружать компонент выходного компонента так, чтобы компонент скрывал и показывал. Естественно, «переключение» не является ключевым словом - это было бы слишком просто :) Я довольно новичок в JSF и javascript и пробую разные вещи для большей части сегодняшнего дня. Кто-нибудь может порекомендовать что-нибудь, чтобы направить меня в правильном направлении?

Ответы [ 3 ]

1 голос
/ 15 апреля 2012

Для меня сработало следующее решение, в то время как verifyPanel - это панель во всплывающем окне, содержащая обновленные данные. 

<rich:column>
    <a4j:commandButton value="Delete" render="confirmPanel"
        oncomplete="#{rich:component('confirmPane')}.show()"
        ajaxSingle="true">
        <a4j:param value="#{record.id}" assignTo="#{showActivitiesAsTableView.selectedActivityId}" />
    </a4j:commandButton>
</rich:column>
0 голосов
/ 15 мая 2019

Я только что наткнулся на это. Надеюсь, кто-то найдет мое относительно простое решение полезным после столь длительного времени: 

<h:form id="myForm">

  <h:outputScript>
    var popupVisible = false;

    function toggleComponent(component, currentVisibility) {
      if (!currentVisibility) {
        component.show();
      } else {
        component.hide();
      }
    }
  </h:outputScript>

  <rich:popupPanel id="myPopup" domElementAttachment="form" modal="false"
                   onshow="popupVisible = true;"
                   onhide="popupVisible = false;">
    <!-- popup content here -->
  </rich:popupPanel>

  <a4j:commandLink onclick="toggleComponent( #{rich:component('myPopup')}, popupVisible );">
    <h:graphicImage value="/images/some_fancy_icon.jpg" />
  </a4j:commandLink>

</h:form>

Обратите внимание: работает только с немодальной панелью.

Вы можете даже иметь несколько всплывающих окон, и при onshow () одного всплывающего окна вы можете закрыть все остальные. Конечно, вам нужна отдельная ... видимая переменная для каждого из них.

0 голосов
/ 05 мая 2012

В итоге я просто выбрал ленивый маршрут:

Я отредактировал CSS на странице, чтобы использовать стиль rf-p-shade, не влияющий на альфа, и сделал событие onmaskclick, чтобы закрыть всплывающее окно. Я не мог заставить его реплицировать поведение типа «Toggle» с нотациями javascript или jsf.

...