I am trying to validate a inputText box based on the selection of a CheckBox as shown below.
< <h:inputText required="#{param[facesContext.externalContext.response.namespace'form:checkBoxId']}"> >.
The issue is as you see, the component Ids are dynamic, I should be able to use facesContext.externalContext.response.namespace inside the EL expression. Is there a solution to it, appreciate any suggestions.
Thanks.
Just bind the UIComponent to a page scoped property and access its getValue() method.
<h:selectBooleanCheckbox binding="#{checkbox}" />
<h:inputText required="#{not empty checkbox.value and checkbox.value}" />
As to the dynamicness, you can also go around by just giving it a fixed id.
<h:form id="form">
<h:selectBooleanCheckbox id="checkbox" />
<h:inputText required="#{not empty param['form:checkbox'] and param['form:checkbox']}" />
</h:form>
It's however only ugly when it gets lengthy.
Related
I have the following JSF construct:
<c:set var="myVar" value="#{myBean.getMyMap()}" scope="request" />
<h:form>
<p>
<h:outputText value="Output1: " />
<h:selectOneMenu value="#{myMappingsBean.data.attribute1}" binding="#{input1}" required="true">
<f:selectItems var="entry" value="#{myVar}"/>
<p:ajax update="myDropdown"/>
</h:selectOneMenu>
</p>
<p>
<h:outputText value="Output2: " />
<h:selectOneMenu id="myDropdown" value="#{myMappingsBean.data.attribute2}" binding="#{input2}" required="true" converter="javax.faces.Double">
<f:selectItems var="entry" value="#{myVar.get(input1.value)}"/>
</h:selectOneMenu>
</p>
</h:form>
Behind myVar is a map defined like that: Map<String, Collection<Double>>
The first dropdown menu shows a list of all the keys of that map (like desired), but the value behind that is the collection of values.
Here the HTML output of one option of that dropdown:
<option value="[1.0, 2.0]">SomeString</option>
My second dropdown should list the collection of double values stored in the map behind the key, that is selected by the first menu.
The problem now is, when I use value="#{myVar.get(input1.value)}" the value I get from .value is the collection and not the string/key of the map. So I never get the desired result.
How can I get the string/key behind the binded object input1? Is there something like input1.name or .toString? Is somewhere a documentary for this?
Ok, I solved it by applying the solution from here.
The first drop down has to be edited to the following:
<p>
<h:outputText value="Output1: " />
<h:selectOneMenu value="#{myMappingsBean.data.attribute1}" binding="#{input1}" required="true">
<f:selectItems var="entry" value="#{myVar.entrySet()}" itemValue="#{entry.key}" itemLabel="#{entry.key}"/>
</h:selectOneMenu>
</p>
As you can see, the entry set is created from the map and from that you use the key as value and label.
And with that the value behind input1.value now is not the collection of doubles but the key of the map.
I display error messages somewhere on <p:tooltip> as follows.
<p:inputText id="text" value="#{bean.text}" required="true"/>
<p:tooltip for="text">
<p:message for="text"/>
</p:tooltip>
Although it displays an error message the given tooltip, an empty/unnecessary tooltip is shown, when there is no error as can be seen in the following picture - beside the bottom right corner of the text box.
How to get rid of such empty tooltips? (I tried someway but it did not work)
It can be done by checking for an error message in the list java.util.List<FacesMessage> that can be obtained by using facesContext.messageList.
The rendered attribute of <p:tooltip> can be set based on the error message/s found in the list for the associated component/s something along the line.
rendered="#{not empty facesContext.getMessageList('clientId')}"
A working code snippet :
<h:form id="form">
<p:panel id="panel">
<p:inputText id="text" value="#{bean.text}" required="true"/>
<p:tooltip for="text" rendered="#{not empty facesContext.getMessageList('form:text')}">
<p:message for="text"/>
</p:tooltip>
<p:commandButton value="Submit" update="panel"/>
</p:panel>
</h:form>
Or by using component binding. Such as,
<p:inputText id="text" binding="#{inputComponent}" value="#{bean.text}"/>
<p:tooltip for="text" rendered="#{not empty facesContext.getMessageList(inputComponent.clientId)}">
<p:message for="text"/>
</p:tooltip>
Or even
<p:inputText id="text" binding="#{inputComponent}" value="#{bean.text}"/>
<p:tooltip for="text" rendered="#{not inputComponent.valid}">
<p:message for="text"/>
</p:tooltip>
The last two cases are useful especially when the (input) component is enclosed within an iterating component like a <p/h:dataTable>, <p:dataGrid>, <p:dataList> (or even <ui:repeat>) where the uniqueness of enclosing components is determined based on the iterating row index of an iterating component such as, form:dataTable:0:text, form:dataTable:1:text, form:dataTable:2:text... and so on
p:tooltip should have a "rendered" attribute, set it to false
from documentation:
rendered : default=TRUE - value to specify the rendering of the
component, when set to false component will not be rendered.
Source: http://courses.coreservlets.com/Course-Materials/pdf/jsf/primefaces/users-guide/p-tooltip.pdf
I have two buttons that generate inputtexts when clicked. The problem is, when these two buttons are on the same xhtml, wichever is the first one, it is the only one that works.
If you need, here is an explanation on the Code 1 below:
It represents two inputtexts to get the name
and email of the author of a Document. moreAuthors represents
the method getMoreAuthors() that belongs to the Managed Bean inserirBean.
getMoreAuthors() returns a List<AuthorBean>.
The List<AuthorBean> is a property from the Managed Bean inserirBean.
The class AuthorBean creates the instances of Author, it has a property called
Author author.
AddAuthor() adds one more AuthorBean to the List<AuthorBean> in
Managed Bean inserirBean.
If you need, here is an explanation on the Code 2 below:
It follows the same structure from Code 1. Here, there's only one
inputtext that is used to get a subject of a Document.
moreSubjects returns a List<SubjectBean>. The class SubjectBean
creates the instances of the class Subjects.
SubjectBean has a property Subject sub,
and Subject has a property called String subject.
AddSubject() adds one more SubjectBean to the List<SubjectBean> in
Managed Bean inserirBean.
Code 1- If this is the only one on the xhtml, it works:
<h:form >
<h:dataTable value="#{inserirBean.moreAuthors}" var="authorBean">
<h:column>
Nome do Autor:
<h:inputText value="#{authorBean.author.name}" />
</h:column>
<h:column>
Email do Autor:
<h:inputText value="#{authorBean.author.email}" />
</h:column>
<f:facet name="footer">
<h:panelGroup>
<h:commandButton value="+" action="#{inserirBean.addAuthor()}" />
</h:panelGroup>
</f:facet>
</h:dataTable>
</h:form>
2- If this is the only one on the xhtml, it works too:
<h:form >
<h:dataTable value="#{inserirBean.moreSubjects}" var="subjectBean">
<h:column>
Palavras-chave:
<h:inputText value="#{subjectBean.sub.subject}" />
</h:column>
<f:facet name="footer">
<h:panelGroup>
<h:commandButton value="+" action="#{inserirBean.addSubject}" />
</h:panelGroup>
</f:facet>
</h:dataTable>
</h:form>
BUT, if I put these two blocks on the same xhtml, the one that appears first on the browser, always works, and the second, never - and I've already tried to change their position, but whichever I put first place on screen is the one that works.
What's causing this problem?
Thank you!
I just put the two datatables in code 1 and 2 inside the same <form> block and both worked.
I am working on a form which has two datatables. In the first datatable, I am displaying the radio buttons and checkboxes, whereas the second datatable contains
selectOneMenu(s). Value change listener has been implemented on the selectOneMenu and on value change, the subsequent fields gets populated based on the selection.
Everything works fine except that when I select the value from the dropdown, the checkbox and the radio button values are cleared.
f:ajax event="change" has been used for the change event on selectOneMenu. Looks like the whole page gets refreshed and the values are cleared.
I also tried using f:ajax by updating the id of the datatable in which the selectOneMenu is present.
<p:dataTable styleClass="borderless" id="inResultTable" var="result" value="#{RequestBean.fooFields}" rendered="#{not empty RequestBean.fooFields}">
<p:column style="width:150px;">
<f:facet name="header">
<h:outputText value=" " />
</f:facet>
<h:outputText value="#{msg[result.fldLabel]}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="" />
</f:facet>
<ui:repeat value="#{RequestBean.fooFields}"
var="itm">
<h:selectOneMenu value="#{itm.indFieldValue}"
rendered="#{result.lvlid==itm.lvlid}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectOneMenu>
<h:selectOneRadio value="#{itm.indFieldValue}" rendered="#{result.lvlid==itm.lvlid and result.fldType=='radio'}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectOneRadio>
<h:selectManyCheckbox value="#{itm.indFieldCheckBox}" rendered="#{result.lvlid==itm.lvlid and result.fldType=='selectbox'}">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectManyCheckbox>
</ui:repeat>
</p:column>
</p:dataTable>
<p:dataTable styleClass="borderless"
id="resultTable" var="result"
value="#{RequestBean.depFields}">
<h:selectOneMenu value="#{RequestBean.field4Value}"
valueChangeListener="#{RequestBean.processValueChange4}"
rendered="#{result.lvlid=='5' and result.fldType=='selectbox'}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItem itemLabel="--Please Select--" itemValue="#{null}" />
<f:selectItems value="#{RequestBean[result.field]}" />
<f:ajax event="change" render="#form" />
</h:selectOneMenu>
...
...
</p:dataTable>
N.B: The requirement is such that the datatable with checkbox and radio buttons has to be placed at the top. IDs cannot be used for the selectOneMenu in the second table since I am
populating the selecOneMenu(s) dynamically based upon the entries in the database.
I know that this might be a simple issue but didn't have any luck with the info posted on most websites.
Any help would be appreciated.
Here's your <f:ajax>.
<f:ajax event="change" render="#form" />
You didn't specify the process attribute. So it defaults to #this, which means that only the current input component is processed during submit. However, you specified a render of the whole form. So the whole form will be refreshed. However, the other input components aren't been processed during submit. So their model values won't be updated, which means that during render response the initial values will be redisplayed instead of the submitted values, which are in your case apparently blank/null.
You've basically 2 options:
Process the whole form during submit.
<f:ajax process="#form" render="#form" />
Or, update only those components which really needs to be updated.
<f:ajax render="clientId1 clientId2 clientId3" />
In your particular case I think option 2 isn't viable, so option 1 is the best one. Please note that I omitted the event attribute. It defaults to change already.
Unrelated to the concrete problem, I'm not sure what you're all doing in your value change listener method, but I only want to note that most starters abuse it for the purpose of manipulating the model values and that it don't always work quite as expected (changed model values are not reflected at all). If this is true in your case, then you should actually be using <f:ajax listener> instead.
See also:
When to use valueChangeListener or f:ajax listener?
The main reason for the values of Check boxes & Radio buttons getting cleared after a value change listener could be that the model values are not updated.
Value change listeners are called before updating the model.
For these kind of issues, it is very important to have an understanding of the JSF lifecycle.
Please try following code in your value change listener and see.
public void valueChange(ValueChangeEvent event){
PhaseId phase = event.getPhaseId();
if (phase.equals(PhaseId.ANY_PHASE))
{
event.setPhaseId(PhaseId.UPDATE_MODEL_VALUES);
event.queue();
return;
}
if(!phase.equals(PhaseId.UPDATE_MODEL_VALUES))
{
return;
}
// Your code
}
I didn't try this code with your example. Please let me know with complete example source code if it is not working.
Thanks.
My requirement is like this: I am having a text input and whenever a value change event occurs, a select many list box has to be populated. If there is no matching records found, then a text input has to appear instead of a select many list box.
<h:column>
<h:selectManyListbox size="3" value="#{hostInfoBean.gateKeeperendPointReference}" rendered="#{hostInfoBean.selectManyRendered}" id="gateKeeperendPointReference">
<f:selectItems value="#{hostInfoBean.gateKeeperendPointReferenceItems}" />
</h:selectManyListbox>
<h:inputText id="gateKeeperendPointReferenceText" size="30" rendered="#{!hostInfoBean.selectManyRendered}">
</h:inputText>
</h:column>
Also I am using a4j for the value change listener,
<a4j:support event="onchange" reRender="hostInfo:gateKeeperendPointReference" focus="GFacPath"
ajaxSingle="true" />
'selectManyRendered' is a boolean value which I am determining in the JAVA bean. The program works only for the default value of the boolean variable. If the boolean value is changed during runtime, then the toggle between the visibility of selectManyListbox and inputText is not working. Please help to fix this. Am i missing something?
regards,
Suresh
If the "rendered" attribute resolves to false, then the component isn't in your tree and can't be found as a "rerender" target. When you have components that are rendered conditionally you want to wrap them in a component that is always available as a target, like so:
<h:inputText value="#{myBean.text}" >
<a4j:support event="onkeyup" reRender="listZone" ajaxSingle="true" />
</h:inputText>
<h:panelGroup id="listZone">
<h:selectManyListbox value="#{myBean.list}" rendered="#{myBean.renderList}" >
<f:selectItems value="#{myBean.listItems}" />
</h:selectManyListbox>
<h:inputText size="30" rendered="#{!myBean.renderList}/>
<h:panelGroup id="listZone">