Hello people,
i have the problem, that I cant make the <h:panelGrid> tag responsive.
Now you probably ask, why I dont use the <p:panelGrid> tag. The answer is, that the Primefaces panelGrid does not work with the Primefaces accordionPanel, if you use in every tab a new panelGrid.
Do you have an idea how I can make the h:panelGrid responsive.
Thank you.
Pascal
How to make <h:panelGrid> resposive
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
I don't think it is possible to have responsive h:panelGrid, what is the exact issue with accordion and panelGrid? Can you post some code demonstrating the issue?
Also do you use Spark?
Also do you use Spark?
Hey,
yeah im using Spark
here is my code. If u change the h:panelGrind to p:panelGrid the 2. tab will not work anymore.
yeah im using Spark
here is my code. If u change the h:panelGrind to p:panelGrid the 2. tab will not work anymore.
Code: Select all
<p:accordionPanel multiple="true">
<p:tab title="Daten Mutter">
<h:panelGrid columns="4" cellpadding="5"
styleClass="Wid100 Reponsive">
<p:outputLabel for="vorname_mutter" value="Vorname:" />
<p:inputText id="vorname_mutter" required="true"
requiredMessage="Bitte gib den Vornamen deiner Mutter an." />
<p:outputLabel for="nachname_mutter" value="Nachname:" />
<p:inputText id="nachname_mutter" required="true"
requiredMessage="Bitte gib den Nachnamen deiner Mutter an." />
<p:outputLabel for="geburtsdatum_mutter" value="Geburtsdatum:" />
<p:calendar required="true"
requiredMessage="Bitte gib das Geburtsdatum deiner Mutter an."
id="geburtsdatum_mutter" locale="de" navigator="true"
pattern="yyyy-MMM-dd" />
<p:outputLabel for="todesdatum_mutter" value="Verstorben am:" />
<p:calendar id="todesdatum_mutter"
value="#{angabeFamilienVerhaeltnisseView.todesdatumMutter}"
locale="de" navigator="true" pattern="yyyy-MMM-dd">
<p:ajax update="@form" event="dateSelect" />
</p:calendar>
<c:if
test="#{empty angabeFamilienVerhaeltnisseView.todesdatumVater and !angabeFamilienVerhaeltnisseView.elternHabenDieGleicheAdresse}">
<p:outputLabel for="straße_hausnummer_mutter"
value="Straße/Hausnummer:" />
<p:inputText id="straße_hausnummer_mutter" required="true"
requiredMessage="Bitte gib die Straße und Hausnummer deiner Mutter an." />
<p:outputLabel for="plz_mutter" value="PLZ:" />
<p:inputText id="plz_mutter" required="true"
requiredMessage="Bitte gib die PLZ deiner Mutter an." />
<p:outputLabel for="ort_mutter" value="Ort:" />
<p:inputText id="ort_mutter" required="true"
requiredMessage="Bitte gib den Wohnort deiner Mutter an." />
<p:outputLabel for="ausland_mutter"
value="Auslandkennbuchstaben:" />
<p:selectOneMenu id="ausland_mutter">
<p:ajax update="ausland_mutter" />
<f:selectItem itemLabel="Auslandskennzeichen wählen"
itemValue="" noSelectionOption="true" />
</p:selectOneMenu>
</c:if>
<p:outputLabel for="staatsangehörigkeit_mutter"
value="Staatsangehörigkeit:" />
<p:selectOneRadio id="staatsangehörigkeit_mutter" value=""
required="true"
requiredMessage="Bitte gib die Staatsangehörigkeit deiner Mutter an.">
<f:selectItem itemLabel="deutsch" itemValue="de" />
<f:selectItem itemLabel="andere" itemValue="andere" />
</p:selectOneRadio>
</h:panelGrid>
</p:tab>
<p:tab title="Daten Vater">
<h:panelGrid columns="4" cellpadding="5"
styleClass="Wid100 Reponsive">
<p:outputLabel for="vorname_vater" value="Vorname:" />
<p:inputText id="vorname_vater" required="true"
requiredMessage="Bitte gib den Vornamen deines Vaters an." />
<p:outputLabel for="nachname_vater" value="Nachname:" />
<p:inputText id="nachname_vater" required="true"
requiredMessage="Bitte gib den Nachnamen deines Vaters an." />
<p:outputLabel for="geburtsdatum_vater" value="Geburtsdatum:" />
<p:calendar required="true"
requiredMessage="Bitte gib das Geburtsdatum deines Vaters an."
id="geburtsdatum_vater" locale="de" navigator="true"
pattern="yyyy-MMM-dd" />
<p:outputLabel for="todesdatum_vater" value="Verstorben am:" />
<p:calendar id="todesdatum_vater"
value="#{angabeFamilienVerhaeltnisseView.todesdatumVater}"
locale="de" navigator="true" pattern="yyyy-MMM-dd">
<p:ajax update="@form" event="dateSelect" />
</p:calendar>
<c:if
test="#{empty angabeFamilienVerhaeltnisseView.todesdatumVater and !angabeFamilienVerhaeltnisseView.elternHabenDieGleicheAdresse}">
<p:outputLabel for="straße_hausnummer_vater"
value="Straße/Hausnummer:" />
<p:inputText id="straße_hausnummer_vater" required="true"
requiredMessage="Bitte gib die Straße und Hausnummer deines Vaters an." />
<p:outputLabel for="plz_vater" value="PLZ:" />
<p:inputText id="plz_vater" required="true"
requiredMessage="Bitte gib die PLZ deines Vaters an." />
<p:outputLabel for="ort_vater" value="Ort:" />
<p:inputText id="ort_vater" required="true"
requiredMessage="Bitte gib den Wohnort deines Vaters an." />
<p:outputLabel for="ausland_vater" value="Auslandkennbuchstaben:" />
<p:selectOneMenu id="ausland_vater">
<p:ajax update="ausland_vater" />
<f:selectItem itemLabel="Auslandskennzeichen wählen"
itemValue="" noSelectionOption="true" />
</p:selectOneMenu>
</c:if>
<p:outputLabel for="staatsangehörigkeit_vater"
value="Staatsangehörigkeit:" />
<p:selectOneRadio id="staatsangehörigkeit_vater" value=""
required="true"
requiredMessage="Bitte gib die Staatsangehörigkeit deines Vaters an.">
<f:selectItem itemLabel="deutsch" itemValue="de" />
<f:selectItem itemLabel="andere" itemValue="andere" />
</p:selectOneRadio>
</h:panelGrid>
</p:tab>
</p:accordionPanel>
- Primefaces: 7.0
- JSF: 2.2.8
- Wildfly: 8.2
- Java: 8
- JSF: 2.2.8
- Wildfly: 8.2
- Java: 8
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
What do you mean second tab not working anymore?
Have you tried grid layout mode?
Have you tried grid layout mode?
Code: Select all
<p:panelGrid columns="4" layout="grid">
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
Does it happen when you don't use Spark?
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
Glad to hear.
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
Yes, I'm not sure about this as well.
-
- Information
-
Who is online
Users browsing this forum: No registered users and 5 guests