CODEWITHSUNDEEP
primefaces
Rita
Rita

Reputation: 1273

Why does AJAX update in Primefaces 5.3 works

I was using Primefaces 5.0 and when I updated a p:selectCheckboxMenu with AJAX, it stopped working. After some research I came to understand that its listeners were broken because the HTML DOM tree was injected with new HTML components (returned in the AJAX response) and, because ready() was not reinvoked, the listeners were not reattached.

When I upgraded to Primefaces 5.3 (using the same code) the AJAX update started working.

I thought that they replaced $(selector).on(event,function) {...} with $(document).on(event,selector,function) {...}, binding the listeners to the document instead of the components... but they kept the $(selector).on(event,function) {...} approach!

Any ideas on how they solved that problem? How are the listeners attached to new components then?

Upvotes: 0

Views: 371

Answers (1)

Rita
Rita

Reputation: 1273

The update is working because of the escaped client ID. After overriding the refresh function, as suggested by @Kukeltje, I could test it. The PrimeFaces.escapeClientId function it’s a js function to replace the colon “:” with double backslashes. Thanks to this correction, the AJAX update in Primefaces 5.3 works correctly!

For testing purposes, I overrided the refresh function of the SelectCheckboxMenu, added a print just to make sure it was being called and replaced the 5.3 refresh with the 5.0 refresh.

PrimeFaces.widget.SelectCheckboxMenu.prototype.refresh = function(a) {
        console.log('method overriden!');
        $(this.panelId).remove();
        this.init(a)
}

As suspected, the refresh stopped working, confirming that the ID was not being escaped before!

Upvotes: 0

Related Questions