How to reference #{cc.clientId} in ajax update/process/render/execute? - ajax

I don't know how to reference descendant components of composite component in update or process (alias render or execute).
I have this composite component resources/components/crud.xhtml:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsf/composite">
<c:interface>
<c:attribute name="controller" required="true" />
<c:facet name="fields" required="true"/>
</c:interface>
<c:implementation>
<p:dataTable
id="table"
value="#{cc.attrs.controller.autoResultModel}"
var="unit"
paginator="true"
rows="10"
lazy="true"
paginatorAlwaysVisible="true"
paginatorPosition="top"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
currentPageReportTemplate="{totalRecords} records found, Page: {currentPage}/{totalPages}"
rowsPerPageTemplate="5,10,15"
sortBy="#{unit.creationTime}"
sortOrder="descending"
selectionMode="single"
selection="#{cc.attrs.controller.selected}">
<p:ajax event="rowSelect" update="editDialog trashDialog table:commands"/>
<f:facet name="header">
<h:panelGroup id="commands" layout="block">
<p:commandButton id="newButton" value="new" image="ui-icon ui-icon-plusthick" oncomplete="editDialog.show()" actionListener="#{cc.attrs.controller.clearSelected()}" process="#this" update="#{cc.clientId}" />
<p:commandButton value="edit" image="ui-icon ui-icon-wrench" onclick="editDialog.show()" type="button" disabled="#{cc.attrs.controller.selected.id == null}"/>
<p:commandButton value="delete" image="ui-icon ui-icon-trash" onclick="trashDialog.show()" type="button" disabled="#{cc.attrs.controller.selected.id == null}"/>
</h:panelGroup>
</f:facet>
<c:insertChildren/>
</p:dataTable>
<h:panelGroup id="editDialog">
<p:dialog modal="true" widgetVar="editDialog" showEffect="fold" hideEffect="puff">
<f:facet name="header">
<h:outputText value="#{bundle['create']}" rendered="#{cc.attrs.controller.selected.id == null}"/>
<h:outputText value="#{bundle['update']}" rendered="#{cc.attrs.controller.selected.id != null}"/>
</f:facet>
<h:panelGroup layout="block">
<c:renderFacet name="fields"/>
<br/>
<p:commandButton value="#{bundle['create']}" actionListener="#{cc.attrs.controller.create}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id == null}"/>
<p:commandButton value="#{bundle['update']}" actionListener="#{cc.attrs.controller.update}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id != null}"/>
<p:commandButton value="#{bundle['copy']}" actionListener="#{cc.attrs.controller.create}" process="editDialog" update="table" oncomplete="closeDialog(xhr, status, args, editDialog)" rendered="#{cc.attrs.controller.selected.id != null}">
<f:setPropertyActionListener target="#{cc.attrs.controller.selected.id}" value="#{null}"/>
</p:commandButton>
</h:panelGroup>
</p:dialog>
</h:panelGroup>
<p:dialog modal="true" header="asdasd" widgetVar="trashDialog" hideEffect="explode" showEffect="explode">
<h:panelGroup id="trashDialog" layout="block">
<h:outputText value="#{bundle['trashconfirm']}">
<f:param name="name" value="#{cc.attrs.controller.selected.name}"/>
</h:outputText>
</h:panelGroup>
<p:commandButton value="#{bundle['confirm']}" actionListener="#{cc.attrs.controller.destroy}" process="#this" update="table" oncomplete="closeDialog(xhr, status, args, trashDialog)"/>
</p:dialog>
</c:implementation>
</html>
called by this page test.xhtml:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:cc="http://java.sun.com/jsf/composite/components">
<h:head>
<title>Default Title</title>
<h:outputStylesheet name="css/screen.css"/>
<h:outputScript name="js/common.js"/>
</h:head>
<h:body>
<p:growl id="messages" autoUpdate="true"/>
<h:form id="itemForm">
<cc:crud id="itemCrud" controller="#{itemController}">
<f:facet name="fields">
<h:panelGrid columns="3">
<h:outputLabel value="manufacturer" for="manufacturer"/>
<p:selectOneMenu id="manufacturer" value="#{itemController.selected.manufacturer}" converter="#{manufacturerController.converter}">
<f:selectItems value="#{manufacturerController.facade.findAll()}" var="e" itemLabel="#{e.title}" itemValue="#{e}"/>
</p:selectOneMenu>
<p:message for="manufacturer"/>
<h:outputLabel value="partNumber" for="partNumber"/>
<p:inputText id="partNumber" value="#{itemController.selected.partNumber}"/>
<p:message for="partNumber"/>
<h:outputLabel value="configurationIndex" for="configurationIndex"/>
<p:inputText id="configurationIndex" value="#{itemController.selected.configurationIndex}"/>
<p:message for="configurationIndex"/>
</h:panelGrid>
</f:facet>
<p:column headerText="#{bundle['manufacturer']}" filterBy="#{unit.manufacturer.title}" sortBy="#{unit.manufacturer.title}">
#{unit.manufacturer.title}
</p:column>
<p:column headerText="#{bundle['partNumber']}" filterBy="#{unit.partNumber}" sortBy="#{unit.partNumber}">
#{unit.partNumber}
</p:column>
<p:column headerText="#{bundle['configurationIndex']}" filterBy="#{unit.configurationIndex}" sortBy="#{unit.configurationIndex}">
#{unit.configurationIndex}
</p:column>
<p:column headerText="#{bundle['modifyStatus']}" filterBy="#{unit.modifyStatus}" sortBy="#{unit.modifyStatus}">
#{unit.modifyStatus}
</p:column>
<p:column headerText="#{bundle['description']}" filterBy="#{unit.description}" sortBy="#{unit.description}">
#{unit.description}
</p:column>
</cc:crud>
</h:form>
</h:body>
</html>
And I have this output:
AVVERTENZA: PWC4011: Unable to set request character encoding to UTF-8 from context /epcsdb, because request parameters have already been read, or ServletRequest.getReader() has already been called
INFO: Skipping call to libraryExists(). Please set context-param com.sun.faces.enableMissingResourceLibraryDetection to true to verify if library http://java.sun.com/jsf/composite/components actually exists
INFO: Cannot find component with identifier "itemForm:itemCrud:table:newButton" in view.
INFO: Cannot find component with identifier "itemForm:itemCrud" in view.
INFO: Cannot find component with identifier "editDialog" in view.
INFO: Cannot find component with identifier "trashDialog" in view.
INFO: Cannot find component with identifier "itemForm:itemCrud:j_idt34" in view.
Result of this is that no component is updated with any ajax call. I don't understand why "itemForm:itemCrud:table:newButton" cannot be found. It is only referenced with process="#this".
I'm using primefaces 3.0.RC1-SNAPSHOT and Mojarra 2.1.3_01.

You need to prefix absolute client IDs with the NamingContainer separator which is by default :.
update=":#{cc.clientId}"
See also:
How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"

Related

Updating Primefaces datatable summary row using Ajax

How can I update a primefaces datatable summary row after submitting a form (dialog)?
The datatable is already updated correctly after some CRUD operation, but the summary row doesn't. I'm using p:remoteCommand to update the summary row when filtering the datatable and it works fine.
The List.xhtml:
<h:form id="TreinamentosListForm">
<p:panel header="#{treinaBundle.ListTreinamentosTitle}" >
<p:remoteCommand name="updateFooterSumCountId" update="datalist:footerSumCountId" />
<p:dataTable id="datalist"
filteredValue="#{treinamentosController.filteredTreinamentos}"
value="#{treinamentosController.items}"
var="item"
rowKey="#{item.id}"
paginator="true"
selectionMode="single"
selection="#{treinamentosController.selected}">
<p:ajax event="filter" process="#form" update="#this" listener="#{treinamentosController.onFilter}" oncomplete="updateFooterSumCountId()" />
<p:ajax event="rowSelect" update=":TreinamentosListForm:createButton :TreinamentosListForm:viewButton :TreinamentosListForm:editButton :TreinamentosListForm:deleteButton :TreinamentosListForm:TreinamentosDataTableContextMenu" listener="#{treinamentosController.resetParents}"/>
<p:ajax event="rowUnselect" update=":TreinamentosListForm:createButton :TreinamentosListForm:viewButton :TreinamentosListForm:editButton :TreinamentosListForm:deleteButton :TreinamentosListForm:TreinamentosDataTableContextMenu" listener="#{treinamentosController.resetParents}"/>
<p:ajax event="rowDblselect" onsuccess="document.getElementById('TreinamentosListForm:viewButton').click();"/>
<p:column sortBy="#{item.id}" filterBy="#{item.id}" style="text-align: right">
<f:facet name="header">
<h:outputText value="#{treinaBundle.ListTreinamentosTitle_id}"/>
</f:facet>
<h:outputText value="#{item.id}"/>
</p:column>
<p:columnGroup id="totalGroup" rendered="true" type="footer" >
<p:row>
<p:column style="text-align:right">
<f:facet name="footer">
<!-- the summary row: -->
<h:outputText id="footerSumCountId" value="#{treinamentosController.sumCountId}" />
</f:facet>
</p:column>
</p:row>
</p:columnGroup>
</p:dataTable>
<f:facet name="header">
<p:commandButton id="createButton" icon="ui-icon-plus" value="#{treinaBundle.Create}" actionListener="#{treinamentosController.prepareCreate}" update=":TreinamentosCreateForm" oncomplete="PF('TreinamentosCreateDialog').show()"/>
<p:commandButton id="viewButton" icon="ui-icon-search" value="#{treinaBundle.View}" update=":TreinamentosViewForm" oncomplete="PF('TreinamentosViewDialog').show()" disabled="#{empty treinamentosController.selected}"/>
<p:commandButton id="editButton" icon="ui-icon-pencil" value="#{treinaBundle.Edit}" update=":TreinamentosEditForm" oncomplete="PF('TreinamentosEditDialog').show()" disabled="#{empty treinamentosController.selected}"/>
<p:commandButton id="deleteButton" icon="ui-icon-trash" value="#{treinaBundle.Delete}" actionListener="#{treinamentosController.delete}" update=":growl,datalist" disabled="#{empty treinamentosController.selected}">
<p:confirm header="#{treinaBundle.ConfirmationHeader}" message="#{treinaBundle.ConfirmDeleteMessage}" icon="ui-icon-alert"/>
</p:commandButton>
</f:facet>
</p:panel>
<ui:include src="/WEB-INF/include/confirmation.xhtml"/>
</h:form>
The Create.xhtml:
<p:dialog id="TreinamentosCreateDlg" widgetVar="TreinamentosCreateDialog" modal="true" resizable="false" appendTo="#(body)" header="#{treinaBundle.CreateTreinamentosTitle}" closeOnEscape="true" >
<h:form id="TreinamentosCreateForm">
<h:panelGroup id="display" rendered="#{treinamentosController.selected != null}">
<p:panelGrid columns="2" columnClasses="column">
<p:outputLabel value="#{treinaBundle.CreateTreinamentosLabel_id}" for="id" />
<p:outputLabel id="id" value="Value automatically generated from database." title="#{treinaBundle.CreateTreinamentosTitle_id}" />
</p:panelGrid>
<p:commandButton actionListener="#{treinamentosController.saveNew}" value="#{treinaBundle.Save}" update="#all,display,:TreinamentosListForm:datalist,:growl" oncomplete="handleSubmit(xhr,status,args,PF('TreinamentosCreateDialog'));">
<p:confirm header="#{treinaBundle.ConfirmationHeader}" message="#{treinaBundle.ConfirmCreateMessage}" icon="ui-icon-alert"/>
</p:commandButton>
<p:commandButton value="#{treinaBundle.Cancel}" onclick="PF('TreinamentosCreateDialog').hide()"/>
</h:panelGroup>
</h:form>
</p:dialog>
Thanks in advance.
After reading the Primefaces 5 documentation, what I did was to invoke (in the Create.xhtml) the Primefaces filter method, referencing through the widgetVar defined in the target datatable (in List.xhtml). Doing so, it triggers my p:remoteCommand, which in its turn, triggers the update for the summary row:
<p:commandButton actionListener="#{treinamentosController.saveNew}" value="#{treinaBundle.Save}" update="#this,display,:TreinamentosListForm:datalist,:growl" oncomplete="handleSubmit(xhr,status,args,PF('TreinamentosCreateDialog'),PF('treinamentosTable').filter());" >
<p:confirm header="#{treinaBundle.ConfirmationHeader}" message="#{treinaBundle.ConfirmCreateMessage}" icon="ui-icon-alert"/>
</p:commandButton>
If someone has a more elegant solution, please share. I had not time

Using primefaces p:tabView, the refresh of the tabs using p:ajax doesn't work fine. The first time refresh but the next times doesn't refresh

I have a page with a tabView, with 3 tabs, each tab has a tree. The tree of the third tab (DEVICES CATEGORY/TYPE), depends on what I select in the tree of the second tab (CERTIFICATIONS SYSTEM/PROGRAM). I generate the tree of the third tab dynamically when tab changes, using the event "tabChange"
<p:ajax event="tabChange" listener="#{profileMB.onTabChange}" />
When I select an element of the tree of the second tab and I change to the third tab, for the first time, it works OK, but when I return to the second tab and I mark differents nodes of the tree and I change to the third tab, the third tabs doesn't refresh.
The methods of the event it works OK, and generate the tree well.
public void onTabChange(TabChangeEvent event) {
log.debug(Constants.BEGIN);
if(selectedNodesCS!=null && selectedNodesCS.length>0){
rootDeviceCategory =
getDeviceCategoryService().createRootStructure(rootDeviceCategory, null,listCertSystem,listCertProgram);
}
}
I tried using the update in the ajax event "tabChange":
<p:ajax event="tabChange" listener="#{profileMB.onTabChange}" update=":formManagerProfile:tabsProfile:tabDC" />
but the console says:
Can not update component "org.primefaces.component.tabview.Tab" with id "formManagerProfile:tabsProfile:tabDC" without a attached renderer
This is the code of my XHTML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:form id="formManagerProfile" style="margin: auto auto">
<h:panelGroup id="displayManager">
<p:panelGrid id="panelUp" style="text-align: left;"
styleClass="panelGridWithoutBorder">
<p:row>
<p:column>
<h:outputText value="#{msg['profile.name']}: " for="profileName" />
</p:column>
<p:column>
<h:inputText id="profileName" value="#{profileMB.profileName}"
maxlength="64" styleClass="width-100x100" />
</p:column>
</p:row>
<p:row>
<p:column>
<h:outputText value="#{msg['profile.profileGroup']}: "
for="profileGroup" />
</p:column>
<p:column>
<p:selectOneMenu id="profileGroup"
value="#{profileMB.profileGroupSelected}"
converter="#{selectOneMenuConverterSelf}">
<f:selectItem itemLabel="" itemValue="#{null}" />
<f:selectItems id="pgSelectedItem"
value="#{profileMB.listProfileGroups}" var="pgItem"
itemValue="#{pgItem}" itemLabel="#{pgItem.name}" />
</p:selectOneMenu>
</p:column>
<p:column>
<p:commandButton id="editProfileGroup"
icon="#{msg['icon.update']}"
value="#{msg['button.text.updateProfileGroup']}"
title="#{msg['button.text.updateProfileGroup']}"
actionListener="#{profileMB.managementProfileGroup}"
update=":managerProfileGroupForm :growl"
oncomplete="PF('profileGroupManagerDialogWidget').initPosition();PF('profileGroupManagerDialogWidget').show()" />
</p:column>
</p:row>
</p:panelGrid>
<p:panel styleClass="text_align_left">
<p:commandButton id="saveButtonUp" icon="#{msg['icon.save']}"
value="#{msg['button.text.save']}"
title="#{msg['button.text.save']}"
action="#{profileMB.saveProfile}" update=":growl" />
<p:commandButton id="backButtonUp" icon="#{msg['icon.back']}"
value="#{msg['button.text.back']}"
title="#{msg['button.text.back']}" action="#{profileMB.backAction}"
ajax="false" />
</p:panel>
</h:panelGroup>
<h:panelGroup>
<p:tabView id="tabsProfile" dynamic="true">
<p:ajax event="tabChange" listener="#{profileMB.onTabChange}" />
<p:tab id="tabMenu" title="MENUS">
<p:tree value="#{profileMB.rootAction}" var="elementAction"
selectionMode="checkbox" selection="#{profileMB.selectedNodes}">
<p:treeNode>
<h:outputText value="#{elementAction}" />
</p:treeNode>
</p:tree>
</p:tab>
<p:tab id="tabCS" title="CERTIFICATIONS SYSTEM/PROGRAM">
<p:tree id="TreeCS" value="#{profileMB.rootCertSystem}"
var="elementCS" selectionMode="checkbox"
selection="#{profileMB.selectedNodesCS}">
<!-- <p:ajax event="select" listener="#{profileMB.onClickTreeCS}" /> -->
<!-- <p:ajax event="unselect" listener="#{profileMB.onClickUnSelectTreeCS}" /> -->
<p:ajax async="true" delay="none" immediate="true"
process="TreeCS" event="select" />
<p:ajax async="true" delay="none" immediate="true"
process="TreeCS" event="unselect" />
<p:treeNode>
<h:outputText value="#{elementCS}" />
</p:treeNode>
</p:tree>
</p:tab>
<p:tab id="tabDC" title="DEVICES CATEGORY/TYPE">
<p:tree id="TreeDC" value="#{profileMB.rootDeviceCategory}"
var="elementDC" selectionMode="checkbox"
selection="#{profileMB.selectedNodesDevCat}">
<p:ajax event="select" listener="#{profileMB.onClickTreeDC}" />
<p:ajax event="unselect"
listener="#{profileMB.onClickUnSelectTreeDC}" />
<p:treeNode>
<h:outputText value="#{elementDC}" />
</p:treeNode>
</p:tree>
</p:tab>
</p:tabView>
</h:panelGroup>
</h:form>
</ui:composition>
I'm using primefaces v5.1, JSF v2.2.8, spring v3.2.5, hibernate v4.2.7 and java v1.7
I found the solution in p:tabView I must used cache="false"

JSF Primefaces ajax on p:datatable

I am using JSF Primefaces for my UI. I have a specific requirement about ajax on p:datatable. This is a sample page of my project:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:comp="http://java.sun.com/jsf/composite/components/">
<ui:define name="content">
<h:form id="form1">
<p:growl id="messages" showDetail="false" />
<p:panel header="Available Rows" style="width: 15%;">
<p:dataTable id="table" value="#{rowBean.rows}" var="row"
widgetVar="50" style="width: 60px;" editable="true">
<p:ajax event="rowEdit" listener="#{rowBean.onEdit}"
update="form1:messages" />
<p:ajax event="rowEditCancel" listener="#{rowBean.onCancel}"
update=":form1:messages" />
<p:column>
<f:facet name="header">
<h:outputText value="Row ID" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{row.id}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{row.id}"
style="width:100%" label="Row ID">
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Row Value" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{row.value}" />
</f:facet>
<f:facet name="input">
<p:inputText disabled="true" value="#{row.value}"
style="width:100%" label="Row Value">
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column style="width:6%">
<p:rowEditor />
</p:column>
</p:dataTable>
</p:panel>
<p:spacer height="5px;"/>
<p:panel id="createPanel" header="Create Row" closable="false" toggleable="true"
collapsed="true" style="width: 15%;">
<p:panelGrid columns="6">
<h:outputLabel for="rowBean" value="Row ID" />
<p:inputText value="#{rowBean.row.id}"
required="true" label="Row ID" style="width:125px" />
<h:outputLabel for="rowBean" value="Row Value" />
<p:inputText value="#{rowBean.row.value}"
required="true" label="Row Value" style="width:125px" />
<f:facet name="footer">
<p:commandButton value="Create" action="#{rowBean.createRow}"
update=":form1" />
</f:facet>
</p:panelGrid>
</p:panel>
</h:form>
</ui:define>
</ui:composition>
Here I have a data table which lists down all the rows created. Each row is having id and value. Value is editable. There is one more panel within the form which creates new rows. Backing bean is pre-populated with all the created rows with #PostConstruct. Backing bean is having other methods to edit, cancel and create. This page is working and given below is the new requirement.
In some cases there can be an error associated with each row. If there is an error attached with a row, then the value text needs to be updated like a link. While clicking on the link, the row ID and a parameter needs to be passed to backing bean. With these params, backing bean fetches the error details and passes it to the page. Then the error message needs to be shown on a pop-up.
Can you tell me how to do this?
On the XHTML side:
<p:messages id="messages" showDetail="true" autoUpdate="true" closable="true" />
On the JAVA side, in the function you call when you press the button:
if(error) {
FacesContext.getCurrentInstance().addMessage(
null,
new FacesMessage(FacesMessage.SEVERITY_WARN, "Error",
"Your error message."));
}
PD: This is my first answer, i'm getting used to the post options, i'm sorry if you dont see my message properly ;)
Maybe like this?:
<f:facet name="output">
<h:outputText value="#{row.value}" rendered="#{!row.hasError}" />
<h:commandLink value="#{row.value}" rendered="#{row.hasError}" command="#{row.command(parameters..)}" />
</f:facet>

p:commandbutton update does not work

I have searched through forums and am aware of how id-generation of HTML-DOM-Elements work with NamingContainers and without them. Nonetheless, in this code i try to put a commandbutton in one side of the page, that should trigger an update of the other side of the page.
The 'viewWorkbenchButton' fires its action properly and the backend-data is fine. But :wbManageForm:wbMgmtPanel is not updated.
<ui:composition xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view>
<p:panel id="dataGridPanel">
<p:panelGrid id="dataGridPanelGrid" styleClass="pGrid" columns="2"
columnClasses="alignTop, alignTop">
<p:column>
<h:form id="wbSelectForm">
<p:panel styleClass="noBorderPanel">
<p:dataTable var="workbench"
value="#{WorkbenchControllerBean.myWorkbenches}"
paginator="#{WorkbenchControllerBean.myWorkbenches.size() > 10}"
rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}">
<f:facet name="header">
My Workbenches
</f:facet>
<p:column headerText="Id" sortBy="#{workbench.workbenchId}">
<h:outputText value="#{workbench.workbenchId}" />
</p:column>
<p:column headerText="Name" sortBy="#{workbench.name}">
<h:outputText value="#{workbench.name}" />
</p:column>
<p:column headerText="Actions">
<p:commandButton id="viewWorkbenchButton" icon="ui-icon-show"
title="View Workbench" update=":wbManageForm:wbMgmtPanel"
actionListener="#{WorkbenchControllerBean.viewWorkbench(workbench)}">
</p:commandButton>
</p:column>
</p:dataTable>
</p:panel>
</h:form>
</p:column>
<p:column>
<h:form id="wbManageForm">
<p:panel id="wbMgmtPanel" styleClass="noBorderPanel">
<h:outputText id="tabText" value="Active Wb: #{WorkbenchControllerBean.number}" />
<p:tabView id="tabView">
....
</p:tabView>
</p:panel>
</h:form>
</p:column>
</p:panelGrid>
</p:panel>
</f:view>
I already tried to update different components (:wbManageForm, :wbManageForm:tabText, :wbManageForm:tabView:treetable) but none of them was updated...
I am using Primefaces 3.5.
What am i missing here? Thanks a lot in advance!
Try using action instead of actionListener. Also, update only the wbmanageForm. If that doesn't work, try updating the component with your bean method.
You can do that by adding this to the end of your method: RequestContext.getCurrentInstance().update("wbManageForm");

ajax call in jsf with popup window

Below is my code in .xhtml file. I need to add ajax call in one of the inputtextbox component. Say.. on blur of inputtextbox where id="search_dias" i should make ajax call with popup window showing the response value and then i should place that value in inputTextBox where id="search_partyName"
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:form>
<p:panel id="panel1" styleClass ="myPanelStyle1" header="SEARCH PRODUCTIONS " toggleable="true" toggleSpeed="100">
<h:panelGrid columns="3" border="0" rules="group">
<p:column >
<h:outputLabel for="search_dia" value="Diameter:"/>
</p:column>
<p:column>
<p:inputText id="search_dias" value="#{addFormRequest.diameter}"/>
</p:column>
<p:tooltip for="search_dias" value="Enter Dia Value" showEffect="fade" hideEffect="fade" />
<p:column >
<h:outputLabel for="search_partyName" value="PartyName:"/>
</p:column>
<p:column>
<p:inputText id="search_partyName" value="#{addFormRequest.search_partyName}"/>
</p:column>
<p:tooltip for="search_partyName" value="Enter Party Name" showEffect="fade" hideEffect="fade" />
<p:column >
<h:outputLabel for="search_date" value="Date:"/>
</p:column>
<p:calendar id="search_date" value="#{addFormRequest.search_date}"/>
<p:tooltip for="search_date" value="Enter Production Date" showEffect="fade" hideEffect="fade" />
<p:commandButton id="searchProductions" value="SEARCH" action="search" />
</h:panelGrid>
</p:panel>
</h:form>
The answers can be found here:
Show dialog on dataTable row selection
Inputtext blur event
Show dialog on ajax event in dataTable

Resources