On my page I have a line that displays this line from my database table called timelogging.
<h:outputText value="#{timeLoggingController.selected.id}" title="#bundle.ViewTimeLoggingTitle_id}"/>
Then i have underneath it some input fields etc, then i require my timelogging id to be submitted with the form.
How would i assign the value i get from
timeLoggingController.selected.id
to my
timeLoggingDetailController.selected.logId ?
example of my code:
<h:form>
<h:panelGrid columns="2">
<h:outputText value="#{bundle.ViewTimeLoggingLabel_id}"/>
<h:outputText value="#{timeLoggingController.selected.id}" title="#{bundle.ViewTimeLoggingTitle_id}"/>
</h:panelGrid>
<h:panelGrid columns="2">
<h:outputLabel value="#{bundle.CreateTimeLoggingDetailLabel_timeLoggingDetail_logId}" for="timeLoggingDetail_logId" />
<h:inputText id="timeLoggingDetail_logId" value="#{timeLoggingDetailController.selected.logId}" title="#{bundle.CreateTimeLoggingDetailTitle_logId}" required="true" requiredMessage="#{bundle.CreateTimeLoggingDetailRequiredMessage_logId}"/>
</h:panelGrid>
So what i want to do is to remove the inputText and automatically assign
timeLogging.selected.id
to
timeLoggingDetail.selected.id
at the end of my page:
<h:commandLink action="#{timeLoggingDetailController.create}" value="#{bundle.CreateTimeLoggingDetailSaveLink}" />
</h:form>
Related
I'm using datagrid of two columns on a list of fields which has property of field name and field text (input box)
My output looks ugly. Can I get some suggestions to format it neatly.
xhtml:
<h:form id="myForm">
<p:panel header="Field List">
<p:dataGrid columns="2" layout="grid" value="#{view.displayableFields}" var="currField" id="fapGrid">
<h:column>
<p:outputLabel value="#{currField.name}" />
</h:column>
<h:column>
<p:inputText value="#{currField.value}" />
</h:column>
</p:dataGrid>
</p:panel>
</h:form>
My ugly output:
I have a problem with the JSF validation. I have the following form - only the first inputfield is required. So if I leave them empty and click on the primefaces calendar field - JSF render the whole form and of course I got a message that the field is required.
So I need a solutions that the field only call the blur event or required message when I leave the field not when I click another field etc.
<h:form>
<p:growl id="msg" showDetail="true" />
<b:panelGrid col-spans="4,8" columns="2" id="inputPanel">
<h:outputLabel value="ID*"></h:outputLabel>
<b:inputText value="#{managedBean.avsId}" required="true"
update="msg" onblur="ajax:managedBean.checkDublicates()"></b:inputText>
<h:outputLabel value="Legal Form"></h:outputLabel>
<b:switch animate="true" on-text="natural" offColor="danger"
onColor="success" off-text="forensic"
value="#{managedBean.legalform}">
</b:switch>
<h:outputLabel value="Date"></h:outputLabel>
<p:calendar value="#{managedBean.date}" pattern="dd.MM.yyyy">
<f:converter converterId="timestampConverter" />
</p:calendar>
<h:outputLabel value="Note" style="margin-top:5%;"></h:outputLabel>
<b:inputTextarea style="margin-top:5%;"
value="#{managedBean.note}"></b:inputTextarea>
</b:panelGrid>
<b:commandButton value="apply" look="success"
style="width:100%;" action="#{managedBean.create()}"
update="#form" />
</h:form>
This question already has answers here:
How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"
(6 answers)
Closed 4 years ago.
Here is my code
index.xhtml
<h1>Student List</h1>
<h:form id="studentListForm">
<h:dataTable id="studentsList"
style="border:2px solid;"
var="student"
value="#{tableItems.students}">
<h:column>
<f:facet name="First Name"/>
<h:outputText value="#{student.firstName}"/>
</h:column>
<h:column>
<f:facet name="Last Name"/>
<h:outputText value="#{student.lastName}"/>
</h:column>
<h:column>
<f:facet name="Faculty Name"/>
<h:outputText value="#{student.faculty.name}"/>
</h:column>
</h:dataTable>
<br/>
<p:commandButton value="Add Student"
update=":studentAdding"
oncomplete="PF('studentAddingDialog').show();"/>
</h:form>
addStudent.xhtml
<p:dialog id="studentAddingDialogId" modal="true"
header="Add Student"
widgetVar="studentAddingDialog"
closeOnEscape="true">
<h:form id="studentAdding">
<h:outputLabel value="Student first name"/>
<h:inputText id="firstName"
value="#{tableItems.studentFirstName}"
required="true"/>
<br/>
<h:outputLabel value="Student last name"/>
<h:inputText id="lastName"
value="#{tableItems.studentLastName}"
required="true"/>
<br/>
<h:outputLabel value="Choose student faculty"/>
<h:selectOneMenu id="selectFaculty"
value="#{tableItems.studentFaculty}"
required="true">
<f:selectItem itemLabel="--Select--" itemValue=""/>
<f:selectItems value="#{faculties.faculties}"
var="itam"
itemValue="#{itam.name}"
itemLabel="#{itam.name}"/>
</h:selectOneMenu>
<p:commandButton value="Submit"
actionListener="#{tableItems.addStudent}"
oncomplete="PF('studentAddingDialog').hide();"
update="studentListForm"/>
</h:form>
</p:dialog>
After running the program I see an Error(HTTP Status 500 - Cannot find component for expression ":studentAdding" referenced from "studentListForm:j_idt10".)
why it can't recognize the form with it's id from another xhtml file?
Here you are trying to open a dialog that is located in another page, so when you try to update studentAdding it does not find the form, that explains the error Cannot find component for expression ":studentAdding" referenced from "studentListForm:j_idt10", i suggest you include the page addStudent.xhtml in the main page that is index.xhtml :
<ui:include src="/../studentAdding.xhtml">
<ui:param name="updateForm" value=":studentListForm"/>
</ui:include>
You have to make sure that anything that you want to update from studentAdding.xhtml and that is located in index.xhtml, you have to pass it as a parameter to studentAdding.xhtml, as an exemple studentListForm that you are updating in submit button, so when you update you use the name of the parameter that you passed, which is updateForm, like this :
<p:commandButton value="Submit"
actionListener="#{tableItems.addStudent}"
oncomplete="PF('studentAddingDialog').hide();"
update="updateForm "/>
To use any xhtml element from included xhtml file you can pass it as <ui:param name="yourElementAlias" value=":pathTo:Element"/>. It allows you to use this particular element from included source file:
<ui:include src="/../studentAdding.xhtml">
<ui:param name="yourElementAlias" value=":pathTo:Element"/>
</ui:include>
Then, to use this element in studentAdding.xhtml (for example update it) do it like so:
<p:commandButton value="Submit"
actionListener="#{tableItems.addStudent}"
oncomplete="PF('studentAddingDialog').hide();"
update="#{yourElementAlias}"/>
I am using this dialog to display a Create form
<p:dialog id="dialogoGestion" header="Asignar nueva gestión" widgetVar="dlg1" >
<p:ajax event="close" update="dialogoGestion"/>
<h:form>
<h:panelGrid columns="2">
<h:outputText value="Cliente: "/>
<h:outputText value="#{miscMB.factura.cliente.nombre}"/>
<h:outputText value="Factura: "/>
<h:outputText value="#{miscMB.factura}"/>
<h:outputLabel value="#{bundle.CreateGestionLabel_descripcion}" for="descripcion" />
<p:inputText id="descripcion" value="#{miscMB.nuevaGestion.descripcion}" title="#{bundle.CreateGestionTitle_descripcion}" />
<h:outputLabel value="#{bundle.CreateGestionLabel_fechaLimiteGestion}" for="fechaLimiteGestion" />
<p:calendar locale="es" pattern="dd/MM/yyyy" id="fechaLimiteGestion" value="#{miscMB.nuevaGestion.fechaLimiteGestion}" title="#{bundle.CreateGestionTitle_fechaLimiteGestion}" required="true" requiredMessage="#{bundle.CreateGestionRequiredMessage_fechaLimiteGestion}">
</p:calendar>
<h:outputLabel value="#{bundle.CreateGestionLabel_usuario}" for="usuario" />
<p:selectOneMenu id="usuario" value="#{miscMB.nuevaGestion.usuario}" required="true" requiredMessage="#{bundle.CreateGestionRequiredMessage_usuario}">
<f:selectItems value="#{usuarioController.itemsAvailableSelectOne}"/>
</p:selectOneMenu>
</h:panelGrid>
<br />
<p:commandButton onsuccess="micalendario.update();PF('dlg1').hide();" action="#{gestionController.crearGestion()}" value="#{bundle.CreateGestionSaveLink}" >
<f:setPropertyActionListener target="#{gestionController.selected}" value="#{miscMB.nuevaGestion}"/>
<f:setPropertyActionListener target="#{gestionController.factura}" value="#{miscMB.factura}"/>
<f:setPropertyActionListener value="#{null}" target="#{miscMB.nuevaGestion}"/>
<f:actionListener binding="#{miscMB.anularNuevaGestion()}"/>
<f:actionListener binding="#{miscMB.agregarGestion(gestionController.selected)}"/>
</p:commandButton>
</h:form>
</p:dialog>
This is where I call the dialog to display
<p:commandLink value="Asignar gestión" onclick="PF('dlg1').show();return false;" action="#{gestionController.preparar()}" rendered="#{miscMB.factura!=null}">
<f:setPropertyActionListener target="#{gestionController.factura}" value="#{miscMB.factura}"/>
</p:commandLink>
What happens is that both <h:outputText value="#{miscMB.factura.cliente.nombre}"/> and <h:outputText value="#{miscMB.factura}"/> values display the properties' last state.
For example, the first time an item selected and you call the dialog, the output is none, because the state is not set. Then, when you select another item and call the dialog, the output is the state last set, which is the previous item value.
Apparently, the setPropertyActionListener in the commandLink is called after the dialog is closed or it executes an action, but not when the commandLink is clicked.
So, how can I set the properties before the dialog frame is displayed?
I would like to submit value form jsf page to bean from overlayPanel with checkbox like this:
To show overlay panel and ajax submission I use this code, and see it's OK in debugger:
<p:commandButton id="joinBtn" value="Basic" type="button" disabled="#{dataPropertyCurrent.notJoinable}"/>
<p:overlayPanel id="joinPanel" for="joinBtn" appendToBody="true" dynamic="false">
<f:facet name="header">Details</f:facet>
<p:dataList value="#{treeBean.getDataPropsCouldBeJoinedWith(dataPropertyCurrent)}" type="definition" var="dataJoinVal">
<h:panelGrid columns="2" cellpadding="10">
<h:column>
<p:selectBooleanCheckbox value="#{dataJoinVal.checked}" id="cbID">
<p:ajax event="change" update="cbID" partialSubmit="true"/>
</p:selectBooleanCheckbox>
</h:column>
<h:column>
<h:outputText value="#{dataJoinVal.caption}" />
</h:column>
</h:panelGrid>
</p:dataList>
<!--<p:commandButton value="Apply" id="btnApplyJoin" type="button" process="#parent" />-->
<h:outputLabel value="ID: #{dataPropertyCurrent.joinDataPropertyId}" />
</p:overlayPanel>
But after it when the overlayPanel is hidden and form submit button being pressed with this code:
<p:commandButton value="Apply join" update="joinAccordionPanel,dsAccordionPanelMain" actionListener="#{treeBean.applyJoinOptions}" />
it sets "false" to bean boolean value again.
So how to submit overlayPanel value to bean properly?
PrimeFaces version: 3.5
I've found explanation here: http://forum.primefaces.org/viewtopic.php?f=3&t=30550#p97737:
"If you are using appendToBody, it's strongly recommended to have a form inside the overlayPanel component that wraps all of the input fields and buttons. This is what you have done in your last solution. However, this means that you cannot place the overlayPanel inside another form in the xhtml page because of the limitation on nesting forms. The best solution is typically to avoid appendToBody wherever it's not absolutely necessary."
Edit
I've added <h:form> inside overlayPanel, and now it works fine:
<p:overlayPanel id="joinPanel" for="joinBtn" appendToBody="true" dynamic="true" >
<h:form id="formTmp">
<f:facet name="header">Details</f:facet>
<p:dataList value="#{treeBean.getDataPropsCouldBeJoinedWith(dataPropertyCurrent)}" type="definition" var="dataJoinVal">
<h:panelGrid columns="2" cellpadding="10">
<h:column>
<p:selectBooleanCheckbox value="#{dataJoinVal.checked}" id="cbID">
<p:ajax event="change" update="cbID" partialSubmit="true"/>
</p:selectBooleanCheckbox>
</h:column>
<h:column>
<h:outputText value="#{dataJoinVal.caption}" />
</h:column>
</h:panelGrid>
</p:dataList>
</h:form>
</p:overlayPanel>