Как я могу скрыть отображаемую панель p: до загрузки страницы?

Question

У меня есть страница JSF с двумя компонентами, кнопкой и панелью. Кнопка вызывает jQuery toggle, чтобы скрыть и показать панель. Я хотел бы, чтобы при загрузке страницы панель изначально была скрыта, поэтому, когда я нажимаю кнопку в первый раз, появляется панель.

<p:commandButton onclick="PF('panelMatches').toggle()" value="Matches" type="button" /> 
<p:panel id="button_panel" widgetVar="panelMatches" closable="true" toggleable="true"> 
    Matches: 0 
</p:panel> 

С помощью этого кода панель всегда видна.

Answer 1

просто используйте collapsed="true" как атрибут на <p:panel>. Затем он будет отображаться «закрыт» с самого начала, и первый вызов toggle() откроет его.

Обратитесь к документации по версии primefaces вы используете: http://www.primefaces.org/documentation.html

Name  | Default | Type | Description 
collapsed | false | Boolean | Renders a toggleable panel as collapsed. 

Answer 2

Попробуйте использовать

<p:panel id="button_panel" widgetVar="panelMatches" closable="true" toggleable="true" rendered="#{mybackingbean.showButton}"> Matches: 0 </p:panel>

где свойство mybackingbean.showButton ложно по умолчанию.

Вы можете изменить свой CommandButton: <p:commandButton actionListener="#{mybackingbean.changeShowButton()}" value="Matches" type="button" update="formId"/>

где mybackingbean.changeShowButton() изменение верно -> ложь и ViceVersa значение mybackingbean.showButton.

finally formId is formID формы, в которой живут эти компоненты.