I have a big problem with selectOnMenu in JSF2, i tried to use this component with but not working , i tested also the primefaces example http://www.primefaces.org/showcase/ui/ajax/dropdown.xhtml but without any new result .
i think that i miss some config or filter about ajax in my project or my page.
Here is dropdown code:
<p:selectOneMenu style="width:300px;" value="#{parameterBean.name}">
<f:selectItem itemLabel="Select parameter Type" itemValue="" noSelectionOption="true" />
<f:selectItems value="#{parameterTypeBean.listParameterTypes}" var="ptype" itemValue="#{ptype.id}" itemLabel="#{ptype.name}" />
<p:ajax listener="#{parameterBean.serviceChange}" event="change" update="pTable" process="#form"/>
</p:selectOneMenu>
This is my simple actionBean :
public void serviceChange() {
System.out.println("change");
}
Can you help me to resolve this problem ?
remove process="#form" so it would be
<p:ajax listener="#{parameterBean.serviceChange}" event="change" update="pTable"/>
Related
Using p:treetable selectionMode="checkbox", I am trying to have a checkbox on the header so that selecting it would select all the checkboxes in all the rows of the treetable. All my attempts to invoke the p:ajax listener method processSelectAllRows have failed. I was able to get this done using p:datatable and need the same functionality using p:treetable. Any help will be greatly appreciated.
Below is the code:
<h:form id="searchFormId">
<p:panel id="searchPanelId">
<p:outputPanel id="ResultsPanelId">
<p:treeTable id="resultsTreeTableId" value="#{aBean.resultsRoot}"
scrollRows="20" scrollable="true" var="aNode"
selectionMode="checkbox" selection="#{aBean.selectedResultNodes}">
<p:ajax event="select" listener="#{aBean.onNodeSelect}"
update="resultsTreeTableId" />
<p:ajax event="unselect" listener="#{aBean.onNodeUnselect}"
update="resultsTreeTableId" />
<p:column>
<f:facet name="header">
<p:selectBooleanCheckbox id="allChkb" name="allChkb"
value="#{aBean.selectAll}">
<p:ajax listener="#{aBean.processSelectAllRows}"
process="#this" update="resultsTreeTableId" />
</p:selectBooleanCheckbox>
</f:facet>
<h:outputText value="#{aNode.name}" />
</p:column>
</p:treeTable>
</p:outputPanel>
</p:panel>
</h:form>
Here is the listener method
public void processSelectAllRows(AjaxBehaviorEvent event) {
System.out.println("Select all rows.");}
Environment:
1) Primefaces 3.5 (Won't be able to upgrade any time soon)
2) myfaces-bundle 2.1.15
3) Tomcat server
4) Java 1.7
Instead of AjaxBehaviorEvent you can use NodeSelectEvent.
NodeSelectEvent is a subclass of AjaxBehaviorEvent present in Primefaces 3.5 API. If you is using a not final primefaces version is better use Primefaces Objects instead of Faces Objects.
Hope I have help you! :)
Given the following code:
<p:column headerText="#{text.article}">
<h:panelGroup>
<p:autoComplete id="relationArticle"
value="#{relation.article}"
completeMethod="#{articleRelationsModel.findArticles}"
queryDelay="#{text.query_delay}"
minQueryLength="#{text.artikkel_min_query_length}"
var="article"
itemLabel="#{article.articleNo} #{article.text1}"
itemValue="#{article}"
converter="#{articleConverter}"
scrollHeight="150"
forceSelection="true"
styleClass="ui-autocomplete-big">
<p:ajax event="itemSelect" update="relationUnit" process="#this"/>
</p:autoComplete>
<p:message for="relationArticle"/>
</h:panelGroup>
</p:column>
<p:column headerText="#{text.unit}" style="width: 80px;">
<h:selectOneMenu id="relationUnit" value="#{relation.unit}" converter="#{articleUnitConverter}">
<f:selectItem itemLabel="<< #{text.search}" noSelectionOption="true" itemDisabled="#{relation.article != null}"/>
<f:selectItems value="#{articleRelationsModel.getUnits(relation)}" var="unit" itemLabel="#{unit.code}" itemValue="#{unit}"/>
<p:ajax event="change" process="#this" update="#this"/>
</h:selectOneMenu>
<p:message for="relationUnit"/>
</p:column>
How can I refresh the "relationUnit" component after the user has selected a value in the "relationArticle" component?
What happens now, is that after the autcompete itemSelect event has fired, the "relationUnit" component gets updated with new content using #{articleRelationsModel.getUnits(relation)}. During this update, the relation object is updated with one of the options from the resulting list. This, however, is not reflected in the "relationUnit" component after the update. But if I manually do another update after this, it gets selected.
How can I achieve the wanted result here?
You can use p:remoteCommand, which is usually used to call the ManagedBean Methods from Javascript.
While it serves the above purpose you can use it to update other components also.
You can call the p:remoteCommand from p:ajax's oncomplete attribute.
<p:autoComplete id="relationArticle" ...>
<p:ajax event="itemSelect" update="relationUnit" onComplete="updateRelationUnit()" process="#this"/>
</p:autoComplete>
<p:remoteCommand name="updateRelationUnit" update="relationUnit" process="#this" />
Now p:ajax will update relationUnit once and then calls the p:remoteCommand which in-turn relationUnit again.
I don't know why you want this strange behavior, but the above strategy and code servers your purpose just fine.
We are using JSF 1.2 for our project. Requirement is to update another selectonemenu options based on a value change in the current selectonemenu.
Based on select1 option, select2 needs to be updated.
<h:selectOneMenu id="select1" value="#{subscription.subscriptions}" onchange="javascriptMethod()">
<f:selectItem id="item1" itemLabel="News" itemValue="1" />
<f:selectItem id="item2" itemLabel="Sports" itemValue="2" />
</h:selectOneMenu>
<h:panelGroup id="panel2">
<h:selectOneMenu id="select2" value="#{subscription.subscriptions2}">
<f:selectItem id="item1" itemLabel="News" itemValue="1" />
<f:selectItem id="item2" itemLabel="Sports" itemValue="2" />
</h:selectOneMenu>
</h:panelGroup>
You can use ajax support like this
<h:selectOneMenu id="select1" value="#{subscription.subscriptions}" >
<f:selectItem id="item1" itemLabel="News" itemValue="1" />
<f:selectItem id="item2" itemLabel="Sports" itemValue="2" />
</h:selectOneMenu>
Jsf 1.2 doesn't have ajax support the only thing you can do is full page reload which happens on a command button.
I presumed you are using richfaces as a third party for ajax and rich ui components.
Hope this helps.
If you are using primefaces then you can replace tag with like this
<p:ajax event="onchange" update="select2" action="if you want to anything in
backend"/>
If you want to do by javascript then have a hidden h:commandButton and put code in your
javascriptMethod() method like this
document.getElementById("myHiddenButtonId").click();
I am trying to implement cascading drop down in JSF. listing down the things that i did below please help me
XHTML code:
<h:selectOneMenu value="#{bean.country_id}" id="countries">
<f:selectItem itemLabel="-- Select a Country -- " itemValue="0"/>
<f:selectItems value="#{bean.countries}" var="country" id="countryList"/>
<f:ajax event="change" listener="#{bean.getCityList}" execute="countries" render="cityList" />
</h:selectOneMenu>
<h:selectOneMenu value="#{bean.city_id}" id="cities">
<f:selectItem itemLabel="-- Select a City -- " itemValue="0"/>
<f:selectItems value="#{bean.cities}" var="city" id="cityList" />
</h:selectOneMenu>
The call is going to getCityList once we change the country and we are getting the countries value int that method too but the list returned in the getcitylist is not getting applied to the cityList and the xhtml is throwing error.
Please help me in this regard
Thanks
KK
Use render="cities" in f:ajax. You have to rerender the whole selectOneMenu to see the updated list in the view.
I want to update content primafaces dialog after it is opened. Is it possible? My example code is below.
<p:dialog widgetVar="pictureSaveDialog" id="pictureDialog" closable="false" >
<p:outputPanel id="saveDialogPanel">
<p:selectOneRadio id="options" value="#{pictureDefinitionsView.radioValue}" >
<f:selectItem itemLabel="FILE" itemValue="FILE" />
<f:selectItem itemLabel="" itemValue="URL" />
<p:ajax update="fileUpload1 fileUpload2" event="click" process="options" />
</p:selectOneRadio>
<p:outputPanel id="fileUpload1" rendered="#{pictureDefinitionsView.selectedFileUpload}"> File </p:outputPanel>
<p:outputPanel id="fileUpload2" rendered="#{pictureDefinitionsView.selectedUrlUpload}"> URL </p:outputPanel>
</p:outputPanel id="saveDialogPanel">
Bean Methods.
public boolean isSelectedFileUpload(){
return radioValue.equals("FILE");
}
public boolean isSelectedUrlUpload(){
return !isSelectedFileUpload();
}
You can define p:remoteCommand which just update dialog, and call that command in onShow attribute:
<p:remoteCommand name="updateDialog" update="saveDialogPanel"/>
<p:dialog widgetVar="pictureSaveDialog" id="pictureDialog" closable="false" onShow="updateDialog()">
If your saveDialogPanel is in some naming container be shore to add appropriate prefix to match id of component.
You better refresh the dialog content before its being open
Your p:commandButton/p:ajax should have the following:
update="pictureDialog" onsuccess="pictureSaveDialog.show()"