Primefaces PanelMenu accordion behavior

[sakkie6yster]

hi tlog, I got a panel menu working 100% in Primefaces 5.3.

[sakkie6yster]

I'm experiencing the same problem trying to upgrade our application from 5.3 to 6.0.
Is there a way to implement this in a way that the panelMenu's "accordion behaviour" will not break with every new release?

[kukeltje]

it does not break with every new release. And maybe file an issue for an enhancement in PF... If you include a good Pull request, that will help

[sakkie6yster]

Hi Kukeltje,

Thank you for your response.
What do you mean with "Good Pull Request"?

[kukeltje]

A pull request that does not break any other functionality

[sakkie6yster]

I migrated our application from 5.3 to 6.2 and was able to resolve the JavaScript error by encompassing it with the JQuery "$(document).ready.." tags:

Code that broke:

Code: Select all

		PF('hbPanelMenu').headers.click(function() {
		    var currHeader = $(this);

		    PF('hbPanelMenu').headers.each(function() {
		        var header = $(this);
		        if (header.text() !== currHeader.text()) {
		        	PF('hbPanelMenu').collapseRootSubmenu(header);
		            header.removeClass('ui-state-hover');
		        }
		    });
		});

Fixed it with:

Code: Select all

$(document).ready(function () {       
		/*
		 *  Function adds accordion behaviour to the PrimeFaces PanelMenu:
		 *  It collapses other menu headers on the selection of a menu header 
		 * */
		PF('hbPanelMenu').headers.click(function() {
		    var currHeader = $(this);

		    PF('hbPanelMenu').headers.each(function() {
		        var header = $(this);
		        if (header.text() !== currHeader.text()) {
		        	PF('hbPanelMenu').collapseRootSubmenu(header);
		            header.removeClass('ui-state-hover');
		        }
		    });
		});		
});	

[kukeltje]

Thanks for reporting back!