How transform OneSelectMenu of PrimeFaces to BootsFaces - jsf

PrimeFaces code:
<p:selectOneMenu onchange= " submit()" value = "${internacionalBean.locale}" valueChangeListener= "#{internacionalBean.cambiarIdioma}" id = "idiomaSelect" style="width:125px">
<f:selectItems value= "#{internacionalBean.countries}" />
</p:selectOneMenu>
I changed p with b, but the valueChangeListener attribute is not defined.

Until we've implemented this feature we've obviously overlooked, you can use onchange="ajax:internacionalBean.cambiarIdioma()" update="#form". Note the slightly different syntax: you have to put ajax: at the beginning to distinguish it from a JavaScript call, and you have to provide the parentheses.
Like BalusC suggests below, you can also try to add an <f:valueChangeListener /> facet.
Would you mind to open a feature request on our bug tracker (https://github.com/TheCoder4eu/BootsFaces-OSP/issues)?

Related

Validation on checkbox and input field in jsf [duplicate]

I have a form which contains a dropdown and two input fields.
<h:selectOneMenu />
<h:inputText />
<h:inputText />
I would like to make the required attribute of the input fields conditional depending on the selected value of the dropdown. If the user chooses the first item of the dropdown, then the input fields must be required. If the user chooses the second item, then those would not be required.
How can I achieve this?
Just bind the dropdown to the view and directly check its value in the required attribute.
<h:selectOneMenu binding="#{menu}" value="#{bean.item}">
<f:selectItem itemValue="first" itemLabel="First item" />
<f:selectItem itemValue="second" itemLabel="Second item" />
</h:selectOneMenu>
<h:inputText value="#{bean.input1}" required="#{menu.value eq 'first'}" />
<h:inputText value="#{bean.input2}" required="#{menu.value eq 'first'}" />
Note that the binding example is as-is. Do absolutely not set it to a bean property here. See also How does the 'binding' attribute work in JSF? When and how should it be used?
Also note that the ordering of the components is significant. If the menu is located below the inputs in the tree, use #{menu.submittedValue eq 'first'} instead. Or if you want to be independent from that, use #{param[menu.clientId] eq 'first'} instead.
Assuming you are using JSF 2.0: Let your SelectOneListBox execute with ajax and re-render the input fields on change of the list box:
A quick sketch:
<h:selectOneMenu value="#{myBean.myMenuValue}">
<f:ajax render="input1"/>
..
</h:selectOneMenu>
<h:inputText id="input1" value="#{myBean.myInputValue}"
required="#{myBean.myMenuValue == 'firstEntry'}" />

JSF commandLink onclick EL expression re-evaluation

I have a JSF command like this:
<h:commandLink id="testId" onclick="if (#{bean.isPageOpen}) dlg.show();" />
The boolean bean.isPageOpen was false initially so the dlg widget was not opened. Now when I change the condition i.e. bean.isPageOpen returns true, the widget still does not get open.
Is the EL expression evaluated only once and never again for JSF commandLink?
Thanks,
-csn
Javascript codes is producing on page load. If you check your page source , You can see your onclick like this.
onclick="if (false) dlg.show();"
If you want to use updated value in your bean.You might use structure like this.I'm using primefaces.
<p:inputText id="textId" value="#{{bean.isPageOpen}" />
<h:commandLink id="testId" onclick="refresh(); if (document.getElementById('textId').value=='true') dlg.show();" />
<p:remoteCommand name="refresh" actionListener="#{bean.updateisPageOpen}" update ="textId"/>

required attribute of inputText should depend on submitted value of another component

I have a form which contains a dropdown and two input fields.
<h:selectOneMenu />
<h:inputText />
<h:inputText />
I would like to make the required attribute of the input fields conditional depending on the selected value of the dropdown. If the user chooses the first item of the dropdown, then the input fields must be required. If the user chooses the second item, then those would not be required.
How can I achieve this?
Just bind the dropdown to the view and directly check its value in the required attribute.
<h:selectOneMenu binding="#{menu}" value="#{bean.item}">
<f:selectItem itemValue="first" itemLabel="First item" />
<f:selectItem itemValue="second" itemLabel="Second item" />
</h:selectOneMenu>
<h:inputText value="#{bean.input1}" required="#{menu.value eq 'first'}" />
<h:inputText value="#{bean.input2}" required="#{menu.value eq 'first'}" />
Note that the binding example is as-is. Do absolutely not set it to a bean property here. See also How does the 'binding' attribute work in JSF? When and how should it be used?
Also note that the ordering of the components is significant. If the menu is located below the inputs in the tree, use #{menu.submittedValue eq 'first'} instead. Or if you want to be independent from that, use #{param[menu.clientId] eq 'first'} instead.
Assuming you are using JSF 2.0: Let your SelectOneListBox execute with ajax and re-render the input fields on change of the list box:
A quick sketch:
<h:selectOneMenu value="#{myBean.myMenuValue}">
<f:ajax render="input1"/>
..
</h:selectOneMenu>
<h:inputText id="input1" value="#{myBean.myInputValue}"
required="#{myBean.myMenuValue == 'firstEntry'}" />

How to call action when select noSelectionLabel?

I have this code above which works perfectly when i select some of the items on him... The a4j:support works fine and rerender my another field correctly...
The problem is if i choose one item, and then i back to "noSelectionLabel"...
When i do this for some reason my a4j:support dont work, i dont get into my method "setarFormulario" and i dont rerender my another field...
<s:decorate template="layout/form.xhtml">
<ui:define name="label">Evento:</ui:define>
<h:selectOneMenu value="#{home.instance.evento}" required="true">
<s:selectItems value="#{eventoService.obterTodos()}" var="evento" label="#{messages[evento.nome]}" noSelectionLabel="#{messages['br.com.message.NoSelection']}" />
<s:convertEntity />
<a4j:support event="onchange" action="#{home.setarFormulario}" reRender="camposFormulario" ajaxSingle="true" />
</h:selectOneMenu>
</s:decorate>
How can i get into my method even if i select the noSelectionLabel? Then my home.instance.evento must be null.. or something like this...
Yor field h:selectOneMenu is required then selecting noSelectionLabel value will cause a validation error and if you had validation error, then the action="#{home.setarFormulario}" would never be called.
As a workaround you can set to true the attribute hideNoSelectionLabel for your s:selectItems then the noSelectionLabel will be hidden when a value is selected
<h:message for="id of the selectonemenu component " ></h:message>
or
remove the required =true from the selectonemenu tag

Concatenating strings within EL expression defined in an attribute of a facelets tag

I need to write an EL expression for an attribute which goes something like this:
#{cc.attrs.appreciatedByCurrentUser ? (cc.attrs.count +'<br/>'+ (cc.attrs.count-1)) : ((cc.attrs.count+1) +'<br/>'+ cc.attrs.count)}
Now the problem is that this gives an error as strings cannot be concatenated, the way I am doing it. So how can I rectify this?
I'm using JSF 2.0 with facelets.
EDIT :
I'm resolving the issue using the following inline javascript
<script type="text/javascript">
var count=#{cc.attrs.count};
document.write(#{cc.attrs.appreciatedByCurrentUser} ? (count-1) +'<br/>'+count : count+'<br/>'+ (count+1));
</script>
Can you think of any issue with this?
It is possible to concatenate Strings in EL using the java.lang.String.concat(String) method. Thus your code could look like:
<h:outputText value="#{cc.attrs.appreciatedByCurrentUser ? (''.concat(cc.attrs.count).concat('<br/>').concat(cc.attrs.count-1)) : (''.concat((cc.attrs.count+1)).concat('<br/>').concat(cc.attrs.count))}" escape="false" />
In this particular case however I would go with one of the options that Mr BalusC had suggested because the code above doesn't look quite elegant. In some cases knowing this technique could be useful, though.
I would hardly recommend using javascript as a workaround here.
String concatenation in EL is only possible by just inlining in the expression. The + operator is in EL exclusively a sum operator. Further, < and > are invalid characters in XML attributes, so you have to escape them (and instruct <h:outputText> to not escape them once again by escape="false"):
<h:outputText value="#{cc.attrs.count}<br/>#{cc.attrs.count-1}" escape="false" rendered="#{cc.attrs.appreciatedByCurrentUser}" />
<h:outputText value="#{cc.attrs.count+1}<br/>#{cc.attrs.count}" escape="false" rendered="#{!cc.attrs.appreciatedByCurrentUser}" />
Alternatively, you can also use <c:set> to alias the expression:
<c:set var="appreciated" value="#{cc.attrs.count}<br/>#{cc.attrs.count-1}" />
<c:set var="notAppreciated" value="#{cc.attrs.count+1}<br/>#{cc.attrs.count}" />
<h:outputText value="#{cc.attrs.appreciatedByCurrentUser ? appreciated : notAppreciated}" escape="false" />
This is the only thing i can come up with.
<h:panelGroup rendered="#{cc.attrs.appreciatedByCurrentUser}">
<h:outputText value="#{(cc.attrs.count)}" style="display:block;" />
<h:outputText value="#{(cc.attrs.count-1)}" />
</h:panelGroup>
<h:panelGroup rendered="#{not cc.attrs.appreciatedByCurrentUser}">
<h:outputText value="#{(cc.attrs.count+1)}" style="display:block;" />
<h:outputText value="#{(cc.attrs.count)}" />
</h:panelGroup>
Putting <br> in a value attribute will always throw errors in JSF, so you'll have to use display:block.

Resources