I have select menu in JSF xhtml page. The select menu contains a
<h:selectOneMenu value="#{bean.statusFlag}">
<f:selectItems value="#{bean.statusList}"/>
</h:selectOneMenu>
The value is be being stored in status.
This works fine. I have to print the value in h:outputText in next column.
<h:outputText value="#{bean.statusFlag}" />
prints code rather value corresponding value of code, since the value is in statusList.
Is there any way to achieve this without having to modify the backing bean.
You could perhaps implement some sort of <f:ajax> within your <h:selectOneMenu>.
You could also use jquery with an onchange() event.
$('#select').change(function() {
$('#outText').val($('#select').val());
});
Hope that helps!
Related
I have a Map (Integer, List) which I want to fill from a JSF page. I'm only using JSF, no Primefaces or such.
On my JSF page there is a selectOneMenu that displays each keys of my Map, and a selectManyBox to choose the values for each key.
I want to be able to save each state before submitting the whole Map.
See my bean:
#ManagedBean(name="myBean")
#SessionScoped
public class MyBean implements Serializable {
(...)
public void refresh(ValueChangeEvent e)
{
if (idRole==-1){ //to check if its just the first selection
setKey((int)e.getNewValue());
}
else{
myObject.getMap().put(key,listOfValuesSelected); //put current manycheckbox values in last selected key
setKey((int)e.getNewValue()); //get new key
listOfValuesSelected=MyObject.getMap().get(Key); //refresh the
//selectManyCheckbox for the newly selected key
}
}
My JSF Page
<h:selectOneMenu id="idRole" value="#{myBean.key}" onchange="submit()" valueChangeListener="#{myBean.refresh}" render="checkbox"> >
<f:selectItem itemLabel="" itemValue="" />
<f:selectItems value="#{myBean.listKeys}" />
</h:selectOneMenu>
<fieldset id="checkbox">
<h:selectManyCheckbox value="#{myBean.listOfValuesSelected}">
<f:selectItems value="#{myBean.listeOfValues}" var="n"
itemLabel="#{n.title}" itemValue="#{n.key}"/>
</h:selectManyCheckbox>
</fieldset>
My real code is kind of a mess, I rearranged it a bit to fit the needs of my question but I can give you the real code if needed.
My problem is that the selectmanycheckbox doesn't "react" at all. I see that the listOfValuesSelected is modified when I am in debug mode.
Do you use AJAX somewhere? And what kind of form do you use?
With "doesn't react", do you mean it's not re-rendered, or that nothing happens when you select one or more items in it?
If you use AJAX then with the given code the select many checkbox will indeed not re-render (refresh). The reason is that SelectOneMenu doesn't have an attribute "render" that causes something to be re-rendered. Third party components often have such a thing, but the standard components only do that via an f:ajax tag. Also, you can't use a non-component ID as a re-render target. Fieldset is not a component.
See http://docs.oracle.com/javaee/6/tutorial/doc/gkabr.html on how to use f:ajax
i wanted to know if theres a way how to hide a commandbutton to the end users when he deselects all items in the selectCheckboxMenu.
thanks for every comments and suggestions.
Just let the rendered attribute of the command button check if the very same property behind the value attribute of select checkbox menu does not represent an empty collection. You can re-execute this check by updating a persistent parent component of the button using <p:ajax> on change of the select checkbox menu.
So, in a nutshell:
<p:selectCheckboxMenu value="#{bean.selectedItems}">
<f:selectItems value="#{bean.availableItems}" />
<p:ajax update="button" />
</p:selectCheckboxMenu>
<h:panelGroup id="button">
<p:commandButton value="Submit" rendered="#{not empty bean.selectedItems}" />
</h:panelGroup>
No need for unnecessary code such as additional bean properties or listener methods specifically for value change and rendered attribute or ugly hacks such as valueChangeListener as mentioned by the other answer whose answerer is apparently having JSF 1.x in mind.
For command button set rendered attribute for ex
In managed bean create a boolean variable allCheckBoxNotSelected with getters and setters
For checkboxes in valueChangeListener attribute call a managed bean method which will check current values for all check box. If it is not selected then put false to allCheckBoxNotSelected variable and then upadate command button through its id.
I would like my page to be user friendly as much as possible and I have an idea but its a little bit harder in the way I want to solve it.
I'm using primefaces and I would like to have a selectOneMenu element which changes to just an outputText with the value of the selected variable in the selectOneMenu. Anyone have some nifty ideas?
This can be done with ajax and partial rendering. Here is a sketch of my idea (untested and in plain JSF):
<h:panelGroup id="wrapper">
<h:selectOneMenu value="#{myBean.myValue}"
rendered="#{myBean.myValue == someInitialValue}" ...>
<f:ajax render="wrapper"/>
... (your select items here)
</h:selectOneMenu>
<h:outputText value="#{myBean.myValue}"
rendered="#{myBean.myValue != someInitialValue}" .../>
</h:panelGroup>
And that's what it does:
The value of h:selectOneMenu will be initialized and the menu will be rendered only if it is the initial value.
On change of the value, the surrounding panelgroup will be re-rendered, hides the menu and lets the h:outputText appear.
You need a wrapping panelGroup for this because the outputText is not there at page load. If your form is small you could also render=#form or any other surrounding container instead. Then you wouldn't need the wrapper.
I have a datatable where a lot of selectOneMenu items are available , for example, for 10 items each having one selectOneMenu combo. now if i click on any of the combos, they are supposed to save the value in the database and they do it. but after saving the changed value the selectOneMenu is returning back to its previous state. I want the selectOneMenu to keep its current state. also, the method is being invoked for every single combo in the datatable. i really wonder why!! i have been banging my head for the last 2 weeks. any help would be really appreciated. thanks in advance.
this is my first post here. this is my jsf datatable:
<h:dataTable value="#{careNeedBean.controlledCareNeedsList}" var="careNeed"
id="careneed_table" binding="#{careNeedBean.dataTable}">
<h:column>
<f:facet name="header">
<h:outputText value="NeedsLevel"/>
</f:facet>
<h:selectOneMenu id="needs_level_combo" style="width:200px;font-size:9px;"
onchange="submit()"
valueChangeListener="#{careNeedBean.saveTaskAsessment}"
binding="#{careNeedBean.selectOneMenu}">
<f:selectItem itemValue="not_assessed" itemLabel="----Not assessed----"/>
<f:selectItems value="#{careNeed.humanReadableNeedsList}" />
</h:selectOneMenu>
</h:column>
This is my bean code:
public String saveTaskAsessment(ValueChangeEvent event) {
//does some things
return "Success";
}
The valueChangeListener doesn't run on the recently changed component only. In fact, you're using JavaScript submit() function to submit the entire form. The valueChangeListener will always be executed whenever the new selected value differs from the old value as is been declared in the value attribute.
You don't have declared a value attribute, so its default value is effectively null. If the default selected item of the list is not null, then the valueChangeListener will be invoked.
To fix this, you need to assign a value attribute to the component
<h:selectOneMenu value="#{careNeed.needsLevel}">
and you need to prefill it with the same value as the default value of the dropdown list.
this.needsLevel = "not_assessed";
Alternatively, you can also make the default value null.
<f:selectItem itemValue="${null}" itemLabel="----Not assessed----"/>
Unrelated to the problem, since you're already on JSF 2.0, I'd suggest to use <f:ajax> to submit only the recently changed dropdown by ajaxical powers instead of using onchange="submit()" to submit the entire form. That's after all better for user experience.
<h:selectOneMenu>
<f:ajax />
</h:selectOneMenu>
Also, the valueChangeListener method doesn't need to return anything. It will be ignored anyway. Just declare it void.
You can use AjaxSingle="true" and onsubmit="form.refresh();" on your ajax request.
So that it will process only the current component.
form.refresh(); will remove the old cache value.
You will get the refreshed bean value.
I have a JSF page on which I want to have a checkbox that, when clicked, will add/remove certain other form fields from the page. Here is the (simplified) code I currently have for the checkbox:
<h:selectBooleanCheckbox title="showComponentToReRender" value="#{backingBean.showComponentToReRender}">
<a4j:support event="onsubmit" reRender="componentToReRender" />
</h:selectBooleanCheckbox>
Here is the code for the component I want to hide:
<h:selectOneMenu id="componentToReRender" value="#{backingBean.value}" rendered="#{valuesList.rowCount>1 && backingBean.showComponentToReRender}">
<s:selectItems value="#{valuesList}" var="value"/>
</h:selectOneMenu>
Currently, clicking the checkbox does nothing; that "selectOneMenu" will not go away. What am I doing wrong?
You need to wrap the componentToReRender in either:
<h:panelGroup id="componentToReRenderWrapper">
or
<a4j:outputPanel id="componentToReRenderWrapper">
So, effectively you will have:
<h:panelGroup id="componentToReRenderWrapper">
<h:selectOneMenu id="componentToReRender" value="#{backingBean.value}" rendered="#{valuesList.rowCount>1 && backingBean.showComponentToReRender}">
<s:selectItems value="#{valuesList}" var="value"/>
</h:selectOneMenu>
</h:panelGroup>
and change the reRender="componentToReRenderWrapper" in case you use panelGroup, or remove that attribute, in case you use outputPanel.
Found the exact explanation in the RichFaces docs:
Most common problem with using reRender is pointing it to the component that has a "rendered" attribute. Note, that JSF does not mark the place in the browser DOM where the outcome of the component should be placed in case the "rendered" condition returns false. Therefore, after the component becomes rendered during the Ajax request, RichFaces delivers the rendered code to the client, but does not update a page, because the place for update is unknown. You need to point to one of the parent components that has no "rendered" attribute. As an alternative, you can wrap the component with layout="none" .
Don't forget to set ajaxRendered="true" on the a4j:outputPanel