f:ajax listener not called for h:selectBooleanCheckbox - jsf

With code like this :
<h:selectBooleanCheckbox value="#{user.data['selected']}">
<f:ajax event="click" listener="#{timetableBean.processUserEvents}" />
<f:attribute name="user" value="#{user}" />
</h:selectBooleanCheckbox>
The method code is :
public void processUserEvents(AjaxBehaviorEvent e) {
User user = (User) e.getComponent().getAttributes().get("user");
...
}
Clicking on the checkbox does trigger the ajax submit, but the listener method is not being called at all.
To top it off, there's no error messages, and the phases complete normally.
Im was trying mojarra 2.0.4-b09, and after facing this error, i changed to 2.1.2, but the same problem persists.
Is there anything i did wrong ?
Thank you.
UPDATE
The problem was placing the h:selectBooleanCheckbox inside the primefaces datalist (p:dataList). Placing it outside works fine. I wonder what the problem is. Will ask in the primefaces forum now.

Here lies the answer of a similar problem.
The problem was really putting the checkbox inside p:dataList without encapsulating it in a p:column.
After wrapping it with p:column, the listener will be called normally.
Hope it helps !

Related

JSF commandbutton not being called when adding primefaces ajax

I am facing an issue when trying to add javascript function to be called after the command button is called but I am only getting the javascript fuction "forGo()" being called but not the function register located in the managed bean when I remove the p:ajax code the function is executed succesfully but I need the forGo function to be executed too, I wrote this code two years ago and it was working fine, any advice would help, thanks.
<p:commandButton value="Register" actionListener="#{ClientMB.Register()}" >
<p:ajax event="click" oncomplete="forGo()"></p:ajax>
</p:commandButton></h:form>
I would suggest to remove the <p:ajax> and just use the <p:commandButton> oncomplete attribute directly:
<p:commandButton value="Register" actionListener="#{ClientMB.Register()}" oncomplete="forGo()" />

PrimeFaces p:ajax event=change and p:commandButton action

I am having some trouble with my application. I have a <p:inputText> with a <p:ajax> listener for the change event. I also have a <p:commandButton> on my page. Both the ajax listener and <p:commandButton> work as expected when only attempting to invoke one. The problem occurs when user edits <p:inputText> and while still focused on the field, attempts to press the <p:commandButton> which triggers the change event ajax listener (expected) but the <p:commandButton> is not invoked (not expected).
Here is my code:
<p:inputText id="code"
value="#{myBean.code}" >
<p:ajax event="change"
listener="#{myBean.method1(myBean.code)}"
update="#(form :input:not(button))" />
</p:inputText>
<p:commandButton id="searchButton"
value="Click me"
action="#{myBean.method2(myBean.code)}"
process="#this code"
update="#form"
oncomplete="PF('myDlg').show()" />
I have read this question but the answer didn't seem to solve the issue for me.
I have tried processing the button on the ajax listener and I tried putting the button in a different form and not updating that form from the ajax listener but I can't figure it out. Is what I am trying to do even possible?
Thanks in advance for any help.
If your project is running on JSF 2.2 runtime, you can utilize passthrough attributes from namespace http://xmlns.jcp.org/jsf/passthrough
I had the same issue (button doesnt work on 1st press, on next presses it works) and solved it on following way:
Add namespace to your page
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
Add oninput attribute to p:inputText (no need for p:ajax)
<p:inputText id="code" value="#{myBean.code}" pt:oninput="onTextChanged()"/>
Add p:remoteCommand bellow
<p:remoteCommand delay="300" name="onTextChanged"
actionListener="#{myBean.method1(myBean.code)}"
update="#(form :input:not(button))" />
(Delay is not necessary but it gives better performance if text is typed fast.)
oninput attribute will help your input fields to detect any kind of change event: typing, deleting, copying, pasting, cutting,etc... and via p:remoteCommand to pass them to managed bean.
And you will also solve "button" issue.
Sorry for my english.
I found another workaround for this issue.
Advantage against approved answer - no additional requests to server on user input.
I realized that the problem is that the button onclick handler is not called.
But I noticed that the onmousedown handler is called. So I added an onmousedown handler where I shedule onclick call. In the onclick handler I check if the method has already been called or not. And if it was, I cancel the event. So onclick executes only one time for one button click.
Page markup:
<p:commandButton id="searchButton"
...
onclick="return fixOnclick(event)"
onmousedown="return fixOnmousedown(event)"
</p:commandButton>
Javascript:
fixOnmousedown: function (e) {
const target = $(e.target);
target.data("eventToProcess", null);
setTimeout(function () {
target.trigger("click");
}, 10);
return true;
}
fixOnclick: function (e) {
const target = $(e.target);
if (target.data("eventToProcess") == null) {
target.data("eventToProcess", e);
}
return target.data("eventToProcess") === e;
}

Bootsfaces checkbox

<p:selectBooleanCheckbox value="#{dropdownView.value}">
<p:ajax update="msgs" listener="#{dropdownView.add}" />
</p:selectBooleanCheckbox>
In primefaces I am able to call bean method to perform action on click of checkbox with the above code.
But I am unable to call bean method to perform action on click of selectBooleanCheckbox in Bootsfaces.
Can anyone please help regarding how to successfully call a bean method which displays message true or false onclick of selectBooleancheckbox in Bootsfaces.
I have tried this, but it's not working:
<b:selectBooleanCheckbox value="#{dropdownView.value}"
update="msgs" onchange="ajax:ajaxBean.add()" />
I am new to bootsfaces. Any help would be appreciated.Thank you
The BootsFaces showcase has an example how to use AJAX with checkboxes. Our example uses onclick instead of onchange. Other than that, everything seems to be identical. I didn't check that yet, but it's possible b:checkbox doesn't support onchange (although I don't see why not - we've implemented both events).
By the way, the other approach using f:ajax / p:ajax and a listener should work, too. But we've added this feature later, so we don't guarantee that the traditional JSF style of AJAX always works with BootsFaces.

p:dialog not appearing after commandButton oncomplete

I am facing a strange issue and I am not able to find the cause.
I have a dataGrid in which I placed a commandButton.
<p:dataGrid paginator="true"
value="#{bean.searchedSystem}" var="searchedSystemObj"
columns="1" rows="6"
WidgetVar="CadModel" pageLinks="5" filteredValue="" >
<p:commandButton value="More Details..."
action="#{bean.viewMoreDetails(searchedSystemObj)}"
oncompleted="PF('testDialog').show()"/>
On action the bean is called, but it doesn't seem like the oncomplete is getting invoked.
<p:dialog header="Modal Dialog" widgetVar="testDialog"
modal="true" height="600" width="900">
All these are in a single form.
Any idea why ?
Solved:
I have solved this issue. Thank you guys for helping me.
The problem was due to the "processing image..."(like a please wait while processing stuff).. It was not processed properly for each action. So i fixed it and then the dialog box started to appear.
My first idea is that the attribute is oncomplete and not oncompleted.
Also, you have to take care of lowercase/uppercase problems, as JSF is XML, which is case-sensitive. I see a WidgetVar in your code but the correct attribute is widgetVar.
All these are in a single form.
Then my second idea is to put a <h:form> inside the <p:dialog> and make sure you don't nest forms.
See https://stackoverflow.com/a/10579708/1528942 for a rational.

Update JSF in carusell

I currently try to implement a website, where an dialog, opened from an carousel, changes something in the database and the result is shown on the screen. For that, I try to update an area in the dialog. Unfortunately, updating things in an carusell does not seem to work.
I shortened the code to an minimal example, so with the following code:
<p:carousel id="page" value="#{pagebean.pages}"
var="item" numVisible="1">
<h:form id="dlg_2_form">
<h:outputText id="test_2" value="#{pagebean.value}" />
<p:remoteCommand name="update_2" update="test_2" />
Increment
</h:form>
</p:carousel>
the function pagebean.value is not called after I click on Increment, but therefore the constructor of pagebean is called when I click on Increment. So it seems like the carousel makes it impossible to update something in it.
Does anyone know, if there is an possibility to update something which is in a carousel, or if there is a workaround for this problem?
EDIT: After the discussion below, I know that Increment does work, if the scope of the corresponding bean is set to #ViewScoped. I could also trigger this button by giving it a widgetVar and accessing its click function, so this would work. Unfortunately, the Bean I want to use is SessionScoped, and with this kind of view it does not work. Has anybody an hint how to solve this problem? I could copy everything into a second Bean, which is ViewScoped, but this is not a very nice solution.

Resources