I created some programmatily component in a Primefaces Tab.
<h:form>
<p:tabView id="documentDetailsTabs" dynamic="true" cache="true" >
<p:tab id="contenutoTab" title="#{msg['content']}" >
<p:panelGrid columns="4" style="width:100%"
styleClass="table-4col-noborder"
binding="#{documentContentController.propertiesGridComponentModify}"
columnClasses="label-col-4col, value-col-4col,label-col-4col, value- col4col">
</p:panelGrid>
<p:commandButton value="Save"
styleClass="buttonStyle"
process="#form"
action="#{documentContentController.checkInAction}"
/>
</p:tab>
</p:tabView>
</h:form>
The form data aren't setted in backing bean of components. If I move the p:panelGrid component out of the p:tabView the code works.
I'm using Primefaces 3.2 and JSF 2.1.
Can you help me, please?
Related
I am new to JSF, checking related questions did not give me right answer.
I have 2 xhtml files. I specially delete all of items, like style, rendered, beans, etc. All the values displays good, but i cant make it update after pressing button.
1st of them named for example Description is a form with 3 tabs, each of them is a dataTable. Structure is a
<p:tabView id="tabs">
<p:tab id="first">
<h:form id="one">
<p:dataTable id="firstTable/>
</h:form>
</p:tab>
<p:tab id="second">
<h:form id="two">
<p:dataTable id="secondTable/>
</h:form>
</p:tab>
<p:tab id="third">
<h:form id="three">
<p:dataTable id="thirdTable/>
</h:form>
</p:tab>
2nd is a dialog, opened by some button in other component, here i can edit some inputs, and with commandButton "Save"
<h:form id="dialog">
<p:dataTable id="one">
<p:column headerText="FirstColumn">
<p:inputText onfocus="this.select()" id="newInput"
value="#{data['rmp']}"/>
</p:column>
</p:dataTable>
<p:commandButton id="save"
actionListener="#{dialogView.submit}"/>
</h:form>
After pressing "save" button i want my 2nd tab in first xhtml to update and display new value. It is only updates after i refresh the page manually.
I tried to add update="#([id$=':tabs:second'])" but it doesn't work right.
Please help me
Sorry im just a beginner both in english and primefaces mobile.
I want to use ui:repeat within a datalist to do something like:
<p:dataList id="data" var="tache" value="#{affect.listeDesTaches}">
<p:panel id="basic" header="Taches n° #{tache.idTache}" style="padding-bottom:40px">
<ui:repeat id="etapesId" var="etapes" value="#{taches.liste}" >
<p:panelGrid columns="6">
<p:commandButton value="#{etapes.idEtape}" type="button"/>
<p:commandButton value="#{etapes.name}" type="button"/>
<p:commandButton value="#{etapes.description}" type="button"/>
<p:commandButton value="#{etapes.dimension}" type="button"/>
<p:commandButton value="#{etapes.tempsFab}" type="button"/>
<p:commandButton value="#{etapes.reste}" type="button"/>
</p:panelGrid>
</ui:repeat>
</p:panel>
</p:dataList>
but it not working in primefaces mobile.I have no error message and all the information in the interior of "ui-repeat" are not displayed. please help.
PS: i'm using primefaces mobile 0.9.4 and primefaces 5.0
there is a typo. please use value="#{tache.liste}" instead of value="#{taches.liste}".
I have some weird issue with datatable selection (most likely i'm doing something wrong).
Idea is simple - datatable with selection and a dialog to edit the records. The problem is that if i use <h:inputText> tag (or <p:inputText>) it appears to be blank, though the object in the backing bean (indicatorBean.indicator.code) contains data. Interestingly if i put <h:outputText> instead of input the data is shown.
here are contents of my body
<!-- language: xml -->
<h:body>
<h:form id="form">
<p:growl id="messages" showDetail="true"/>
<p:dataTable id="indicatorsTable" var="ind"
value="#{indicatorBean.indicators}"
selectionMode="single"
selection="#{indicatorBean.indicator}"
rowKey="#{ind.id}">
<p:column headerText="Name" style="width:125px">
#{ind.name}
</p:column>
<p:column headerText="Code" style="width:125px">
#{ind.code}
</p:column>
<f:facet name="footer">
<p:commandButton id="viewButton" value="View"
icon="ui-icon-search" update=":form:display"
oncomplete="indDialog.show()"/>
</f:facet>
</p:dataTable>
<p:dialog id="dialog" header="Indicator Detail"
widgetVar="indDialog" resizable="false"
width="400" showEffect="fade" hideEffect="fade">
<h:panelGrid id="display" columns="2" cellpadding="4">
<h:outputText value="Code:"/>
<!-- PROBLEM IS HERE -->
<h:inputText value="#{indicatorBean.indicator.code}"/>
<h:outputText value="Name:"/>
<h:outputText value="#{indicatorBean.indicator.name}"/>
</h:panelGrid>
<p:commandButton value="Save" onclick="indDialog.hide()"/>
<p:commandButton value="Cancel" onclick="indDialog.hide()"/>
</p:dialog>
</h:form>
</h:body>
Backing bean is nothing other that accessors.
Another thing i spotted is if i replace el expression in <h:inputtext> with a static text (like <h:inputText value="static text"/>), it is shown.
Here are some pictures:
Dialog with inputtext
Dialog with outputtext
Dialog with static text
primefaces 3.4
The problem as you seem to have already figured out is that you are placing the dialog itself inside of a form. This is an issue because of the way the jQuery dialog control works, which is the client side foundation of the Primefaces dialog. Essentially it will move DOM elements associated with the dialog elsewhere, possibly outside of the form that you intend to enclose it.
This problem can be easily solved by putting the dialog outside of the form, and putting a form inside of the dialog body instead.
<p:dialog id="dialogId" ...>
<h:form id="dlgForm">
....
</h:form>
</p:dialog>
In this way when jQuery UI moves the dialog control elsewhere in the DOM, the contents of that DOM, including the form come with it.
i have an issue with nested UI components which is probably a known bug in PrimeFaces and Mojara. However I have no idea how can i solve it.
We have a image gallery with uploader and I want to be able to delete images from the datagrid, so
XHTML:
<h:form enctype="multipart/form-data">
<p:fileUpload fileUploadListener="#{pictureManagementBean.handleFileUpload}"
mode="advanced"
update="gallery messages"
auto="true"
allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
/>
<p:growl id="messages" showDetail="true"/>
<p:dataGrid var="item" value="#{pictureManagementBean.pictures}" id="gallery">
<p:panel header="#{item.pictureName}" style="text-align:center">
<h:panelGrid columns="1" style="width:100%">
<p:graphicImage value="#{item.thumbnailDir}" />
<h:outputText value="#{item.createdate.toString()}" />
<p:commandLink value="Delete"
action="#{pictureManagementBean.removePicture(item.idpicture)}" ajax="false"/>
</h:panelGrid>
</p:panel>
</p:dataGrid>
</h:form>
Basically what is not working at the momment - at all - is the commandLink Delete in the DataGrid. The rest is fine.
Is there any walkaround to this? I've tried: columns, ajax, no ajax... nothing works. All i can do is get the button outside the DataGrid. But that's not really what I want.
Any help apprecieated.
[small thing: surprisingly I have used commandLink in DataTable and Columns with no problem! ]
Primefaces 3.4RC1 from maven. (didnt work on 3.3.1 either)
ok so I've found one thing:
inside <p:dataGrid> if I use anything BUT p:columns its not working.
But then the view is terrible... should I just use CSS to fix it?
#Maple_shaft you are so right!
correct code:
<p:dataGrid var="item" value="#{pictureManagementBean.pictures}" id="gallery">
<p:column>
<p:panel header="#{item.pictureName}" style="text-align:center">
<h:panelGrid columns="1" style="width:100%">
<p:graphicImage value="#{item.thumbnailDir}" />
<h:outputText value="#{item.createdate.toString()}" />
<p:commandLink value="Delete"
action="#{pictureManagementBean.removePicture(item.idpicture)}" ajax="false"/>
</h:panelGrid>
</p:panel>
</p:column>
</p:dataGrid>
So just simple column element. I've just places it wrong before. Thanks so much.
Of course backing bean is #ViewScoped!
I have a problem are that when I try update a component that not are in same xhtml.
Somebody know how to do?
thx
PD: im using primefaces 3.2
Sorry for my english
I think that I dnot explain very well.
I have a xhtml father with tis structure:
<h:panelGrid id="tabla">
<h:form id="formTripu" prependId="false">
<h:panelGrid id="fichaTripulante">
<ui:include src="path1" />
<p:spacer height="5px" />
<p:tabView dynamic="false" cache="true">
<p:tab title="#{bundleTrip.datosAdministrativos}">
<ui:include
src="path2" />
</p:tab>
<p:tab title="Datos Operativos ">
<ui:include
src="path3" />
</p:tab>
I wish to do are when for example in path1 I use a h:selectBooleanCheckbox like:
<h:selectBooleanCheckbox inmediate="true" id="checkExt"
value="#{bean.Obj.field}">
<f:ajax render="estadoTripu"
actionListener="#{bean.method}" />
</h:selectBooleanCheckbox>
estadoTripu are in path2 (otherxthml but in same form).
<p:panel>
<h:panelGrid id="datos" columns="5">
<p:column>
<h:selectOneMenu id="estadoTripu"
value="#{bean.Obj.Field2}">
<f:selectItems
value="#{bean.list}" var="item"
itemValue="#{item.id}" immediate="true"
itemLabel="#{item.desc}">
</f:selectItems>
</h:selectOneMenu>
</h:panelGrid>
</p:column>
</h:panelGrid>
</p:panel>
Witch is paht in render o f:ajax????
thx everyone
try this: (Its a trick I learned from BalusC :) )
add binding="#{components.mySelecOneMenu}" to your h:selectOneMenu
<h:selectOneMenu binding="#{components.mySelecOneMenu}" .....
This how you button should look like (more or less)
<h:commandButton value="doSomeThing">
<f:ajax render="#{components.mySelecOneMenu.clientId}"/>
</<h:commandButton>
add this to your faces-config.xml
<managed-bean>
<description>Holder of all component bindings.</description>
<managed-bean-name>components</managed-bean-name>
<managed-bean-class>java.util.HashMap</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
Here some detailed explanation of what I just recommend you to do
How do I break the tyranny of the clientID?
JSF component binding without bean property
if they are not in the same xhtml, do you include one in the other? If not, just change page and it will show the correct one.
But I don't think I correctly understand your question.
Add some code please
I find that component should be in same form an call ids start in form to component, its prefered put id every panelgrid, panel, etc because you have to call every component englobe comoponent that you want render.