Page 1 of 1

Spark Menu Disable Style

Posted: 26 Jun 2015, 10:01
by kahlon1005
I am populating Spark layout menu from model POJO. During this based on some creteria I had disabled few menu element at leaf level. Which works !!!. But the problem is that there style remains unchanged meaning the disabled and enable menu element style remain same which is kind of a problem from user experience point of view.

Re: Spark Menu Disable Style

Posted: 26 Jun 2015, 10:10
by aragorn
A few menuItem is disabled="true" in ps:menu. Right?
Exp;

Code: Select all

<ps:menu>
   <p:submenu label="Spark Theme" icon="fa fa-rocket">
      <p:menuitem value="Forms" icon="fa fa-file-text-o" outcome="forms" />
      <p:menuitem value="Misc" icon="fa fa-stack-overflow" outcome="misc" disabled="true" />
   </p:submenu>
...

Re: Spark Menu Disable Style

Posted: 26 Jun 2015, 19:17
by kahlon1005
Right. The expectation is the disabled style should apply for disabled menu elements When element is disabled from bean or page.

From xhtml

Code: Select all

<p:menuitem value="Misc" icon="fa fa-stack-overflow" outcome="misc" disabled="true" />

From bean

Code: Select all

 
leafNode.setDisabled(true);
 subMenu.addElement(leafNode);

Re: Spark Menu Disable Style

Posted: 28 Jun 2015, 00:46
by aragorn
Thanks for the sample. I've replicated the issue. I think you can try with this changes;
- please change in encodeMenuItem function of SparkMenuRenderer;

Code: Select all

protected void encodeMenuItem(FacesContext context, AbstractMenu menu, MenuItem menuitem, int marginLevel) throws IOException {
        ...
        String styleClass = "Animated05";
        if(marginLevel >= 1) {
            styleClass = styleClass + " menuLevel" + marginLevel;
        }

        if(disabled) { // Added
            styleClass = styleClass + " ui-state-disabled";
        }
        
        writer.startElement("a", null);
        ....
- please add the css code in your layoutmenu.xhtml or spark-layout-* file;

Code: Select all

<style type="text/css">
             #layout-menu li ul li a.ui-state-disabled {
                background-color: transparent !important;
                color: #778d9b !important;
            }
            #layout-menu li ul li:hover > a.ui-state-disabled {
                background-color: transparent !important;
                color: #778d9b !important;
            }
</style>


We will add a similar solution for next version.

Re: Spark Menu Disable Style

Posted: 14 Dec 2016, 18:24
by mmorthosoft1
still not in the current version of spark 2.1.2
I need this fix and you promised to include it in next release.

Re: Spark Menu Disable Style

Posted: 15 Dec 2016, 11:06
by aragorn
Sorry, I added this fix into next version; https://github.com/primefaces/layouts/issues/138

Re: Spark Menu Disable Style

Posted: 15 Dec 2016, 14:09
by mmorthosoft1
thank you very much Sir.

Re: Spark Menu Disable Style

Posted: 15 Dec 2016, 14:09
by aragorn
You're welcome!

Re: Spark Menu Disable Style

Posted: 27 Apr 2017, 14:47
by malkova
Long been looking for this information, thank you guys for the post!!!

Re: Spark Menu Disable Style

Posted: 01 May 2017, 12:19
by aragorn
Thanks ;)