This is code:
<p:ajax event="eventResized" process="#this calendar" listener="#{bean.eventResized}" oncomplete="resizeComplete()"/>
eventReized invoked by EventResizeBehavior which extended from AjaxBehaviorEvent and it contains some property. Can I check inside <p:ajax....> call its value and pass result to oncomplete="resizeComplete(result)"
Something like that
<p:ajax event="eventResized" process="#this calendar" listener="#{bean.eventResized}" oncomplete="resizeComplete(#{eventResized.id == 0})"/>
PrimeFaces doesn't support it. Any EL expressions in oncomplete attribute are immediately evaluated during render response of that HTML document, not during oncomplete of the associated ajax call. Basically, the JavaScript code generated by oncomplete attribute contains the old value as it was during the page load.
Your best bet is using RequestContext#addCallbackParam() to add a property to the PrimeFaces-specific args object which is available in oncomplete scope.
RequestContext.getCurrentInstance().addCallbackParam("result", eventResized.getId() == 0);
<p:ajax ... oncomplete="resizeComplete(args.result)" />
An alternative is to use RequestContext#execute() instead of oncomplete to programmatically instruct PrimeFaces to execute a piece of JavaScript on complete of the ajax request.
RequestContext.getCurrentInstance().execute("resizeComplete(" + (eventResized.getId() == 0) + ")");
Related
How to trigger primefaces <p:blockUI> using boolean in backing bean? In this showcase, it requires a commandButton to trigger the the blockUI. What I want is block some part of the page base on a boolean in the backing bean. Is this possible? I tried setting the rendered attribute in the <p:blockUI> tag but it still won't work.
Here is my code:
<p:blockUI block="grid" rendered="#{bean.trueValue}"></p:blockUI>
<p:panelGrid id="grid">
-- content
</p:panelGrid>
One way is to call hide() and show() method of BlockUI from Managed Bean.
You can do that by using RequestContext:
RequestContext.getCurrentInstance().execute("widgetVar.show()");
Another is you can pass the variable to JavaScript function and then let the Javascript function take care of that for you.
onClick="func(#{elvariable})"
<script type="text/javascript">
function func(value)
{
if(value==something){
widgetVar.show();
}else{
widgetVar.hide();
}
}
Let's say I have a simple method that, like this:
public String test()
{
return "hello";
}
Now let's say I have the following PrimeFace component:
<p:fieldset styleClass="containers" rendered="#{controller.test()}">
<h2>Testing</h2>
<p:outputLabel for="test" value="Test" />
<p:inputText id="test" />
</p:fieldset>
The method above returns "hello". I would like to dynamically show and hide that fieldSet by comparing the returned value of that method to a field of one of my beans. For instance, on the rendered parameter, I would like to do something like: controller.test() != "some variable" which would return true or false. Am I allow to do that? If not, what is the way of doing it?
Basically the goal is to dynamically show and hide some container by comparing the returned value of a method with a bean property.
Look Like you misunderstood rendered
The rendered Attribute
A component tag uses a Boolean EL expression, along with the rendered
attribute, to determine whether or not the component will be rendered.
If you will check above definition you will know what exactly is the use of this attribute.
More you can see below
The rendered attribute which uses Boolean EL expression indicates
whether a component is currently visible or not. The property is
useful when you want to hide components for specific users or based on
condition. The default value of rendered attribute is true.
<h:outputText value=”mapping” rendered=”Boolean EL expression” />
For example, the commandLink component in the following section of a page is not rendered if the cart contains no items:
<h:commandLink id="check"
...
rendered="#{cart.numberOfItems > 0}">
<h:outputText
value="#{bundle.CartCheck}"/>
</h:commandLink>
With your concrete problem you can do like this
Make a String variable call value
Now create get/set methods for above variable
Now in your test method you can add
public void test(){
value="hello";
}
Bur remember you have call test() method of page load
Now in your Xhtml or Jsf or Jsp page
rendered="#{controller.value != 'hello'}"
Or better way create a Boolean variable and do all the magic of hide and show the component
How can I pass current selected row to JavaScript function in <p:ajax oncomplete>?
<p:dataTable value="#{bolt.sites}" var="bolt" selection="#{bolt.selectedSite}" ...>
<p:ajax event="rowSelect" oncomplete="alert(#{bolt.selectedSite.name});" />
I have tried all: #{bolt.selectedSite.name}, #{bolt.name}.
EL expressions in oncomplete attribute are not evaluated after invoking the action. They are already evaluated while rendering the JavaScript code containing that ajax calling logic.
Your best bet is adding a listener method which adds the name as a callback parameter via RequestContext#addCallbackParam() which will then be available as a property of the implicit args object inside oncomplete context.
<p:ajax ... listener="#{bean.select}" oncomplete="alert(args.name)" />
public void select() {
String name = selectedSite.getName();
RequestContext.getCurrentInstance().addCallbackParam("name", name);
}
Unrelated to the concrete problem, you have a syntax error in your initial JavaScript attempt. The property name "name" suggests that it's a string. In JavaScript, all string values should be quoted. So your fictive solution would be oncomplete="alert('#{bolt.selectedSite.name}');"
I need to make a calculator in a jsf view using only client-side part. No data can be passed to server-side.
I have the view splitted in a couple of <h:form> with calculator in the middle:
<h:form id="customer_form">
// view here working nice
</h:form>
<h:panelGroup layout="block" styleClass="ui-grid-col-2 offset-boxes" >
<p:panel id="calculator" header="Calculadora" styleClass="half-screen-height calculator-table">
<h:inputText id="result" widgetVar="result" styleClass="result-text"/>
<p:button value="X" widgetVar="X" ajax="false" onclick="calculate('x')" styleClass="right"></p:button>
// more calculator buttons
</p:panel>
</h:panelGroup>
<h:form id="consumption_form">
// view here working nice
</h:form>
Until here all is ok, but when I try to manage calculator with javascript:
<script type="text/javascript">
function calculate(sel){
if (sel == "x") {
document.getElementById("result").value = "";
} else {
var input = document.getElementById("result").value;
document.getElementById("result").setAttribute("value", input + sel);
}
}
</script>
Each time i change result value, server-side is called and value is reset to original value.
EDIT according to PrimeFaces documentation of p:button::onclick event
Client side callback to execute when button is clicked.
Either <h:button> tag is acting like this, so I guess problem is the way JSF or PrimeFaces are handling the javascript event...
I also tried to call and set input value by jquery with $("result").value but the result i get is a function(b7) not the value itself.
What am I doing wrong?
Thanks! ;)
J
you got to make sure you're JS code will not try to submit the form, so that will trigger a server side call, for that I suggest you return false and try using event.preventDefault() on your HTML buttons onclick calls, so you will avoid bubbling up the event to any listeners.
In order to reducing the state I am trying to reduce the no of commandButtons on my webpages.(I had large no of commandButtons shown under a long list of 20 items (6*20 = 120 commandButtons)). Thus I am trying to figure out a way, through javascript by which I can pass parameters & call the action methods in the ManagedBean controller classes. Is there any way to call action methods from javascript & pass them parameters ?
Richfaces 3.2.0.GA and XHTML as mark up
You can use javascript to call an a4j:js method, which inturn calls action method from managed bean.
The param which you need to pass can be set to a hidden variable which when set will set the value to the java variable in your bean.
<script>
function onButtonClick(){
$("#yourValue").val("value");
actionListenerMethod();
}
</script>
<a4j:jsFunction name="actionListenerMethod"
actionListener="#{yourManagedBean.actionMethod}"
oncomplete="scriptOnComplete();">
</a4j:jsFunction>
<h:inputHidden id="yourValue"
value="#{yourManagedBean.yourValue}" />
Managed bean:
public void actionMethod(ActionEvent event){
if(yourValue == "something"){
/*your action goes here*/
}
}
Otherwise you can by-pass this hidden variable by use of action param
<script>
function onButtonClick(){
actionListenerMethod("value");
}
</script>
<a4j:jsFunction name="actionListenerMethod"
actionListener="#{yourManagedBean.actionMethod}"
oncomplete="scriptOnComplete();">
<a4j:actionparam name="param1"
assignTo="#{yourManagedBean.yourValue}" />
</a4j:jsFunction>
In the later case the action param might get set only after the manged bean gets completed, in this case you can use Action atribute to call your action method instead of an action listener.
This will help you to set the param and then call the action method.
<a4j:jsFunction name="actionListenerMethod"
action="#{yourManagedBean.actionMethod}"
oncomplete="scriptOnComplete();">
<a4j:actionparam name="param1"
assignTo="#{yourManagedBean.yourValue}" />
</a4j:jsFunction>