9 Replies Latest reply: Nov 21, 2012 2:34 AM by user404 RSS

    Problem in setting inLineStyle to a commandMenuItem  programmatically

    shaz90
      Hi,

      im not able to change background color of commandMenuItem on click Programmatically using a java bean.

      here is the java bean code im using.

      public void home(ActionEvent vce) {


      UIComponent component = findComponentInRoot("pt_cmi1");
      System.out.println(component);
      vce.getComponent().processUpdates(FacesContext.getCurrentInstance());
      RichCommandMenuItem home_item=(RichCommandMenuItem)findComponentInRoot("pt_cmi1");
      System.out.println(home_item);
      home_item.setInlineStyle("background-color:red;color:green;");

      System.out.println("background color is set");
      System.out.println( home_item.getInlineStyle()+home_item.getId());
      home_item.setStyleClass("home");

      }

      Thank you
        • 1. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
          kdario
          You probably need to refresh button, try:
          AdfFacesContext.getCurrentInstance().addPartialTarget(home_item);
          Dario
          • 2. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
            shaz90
            Thanks for ur reply dario,

            Still its not taking inline style .am i missing out with some thing ..because ideally it has to take the background color.
            <af:commandMenuItem text="Home" id="pt_cmi1"
            inlineStyle="height:24px;" action="test"
            actionListener="#{myMenu.home}"/>


            public void home(ActionEvent vce) {
            UIComponent component = findComponentInRoot("pt_cmi1");
            System.out.println(component);
            vce.getComponent().processUpdates(FacesContext.getCurrentInstance());
            RichCommandMenuItem home_item=(RichCommandMenuItem)findComponentInRoot("pt_cmi1");
            System.out.println(home_item);
            home_item.setInlineStyle("background-color:red;color:green;height:100px;");
            AdfFacesContext.getCurrentInstance().addPartialTarget(home_item);
            System.out.println("background color is set");
            System.out.println( home_item.getInlineStyle()+home_item.getId());



            }
            • 3. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
              user404
              I don't know your particular use case but if your are just trying to change the inline style of the button you just clicked, then you could use css.
              Great example :
              http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/commandMenuItem.jspx
              (You will probably need something like 'selected')
              • 4. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                shaz90
                thanks for ur reply...

                I tried all these css before ...there is no css property that could change the background color.
                • 5. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                  user404
                  I actually did the same thing you are trying now last week and it took quite some time to figure it out.
                  Here is my css of commandMenuItem :
                  af|commandMenuItem.centerTop,
                  af|menu.centerTop
                  {
                      background: url("../img/navbar-border-right.png") no-repeat scroll right center transparent;
                      padding-top:20px;
                      padding-bottom:20px;
                      padding-right: 2px;
                      font-family:inherit; 
                      font-size:inherit;
                      height:inherit;
                      color: #1068B1 ;
                  }
                  
                  af|commandMenuItem.centerTop::bar-item-text,
                  af|menu.centerTop::bar-item-text
                  {
                      color: #1068B1;
                      text-shadow: 0px 1px 0px white;
                      font-family: "Ubuntu";
                  }
                  
                  af|commandMenuItem::bar-item:highlighted.centerTop,
                  af|menu::bar-item:depressed.centerTop,
                  af|menu.centerTop:highlighted 
                  {   
                      background: url("../img/navbar-border-right.png") no-repeat scroll right center transparent;
                      background-color: #E0E0E0 !important; 
                      text-shadow: 0px 1px 0px white;
                      color: #1068B1;
                      padding-right: 2px;
                      border: 0px;
                  }
                  
                  af|menuBar.centerTop
                  {
                      font-size: 16px; 
                      color: #1E347B; 
                      float: none; 
                      background-color:#EFEFEF;   
                      text-transform: uppercase;
                  }
                  Note that .centerTop is just a styleclass I'm using for skinning different kind of menu's.
                  <af:menuBar id="mb1" styleClass="centerTop">
                   
                          <af:commandMenuItem text="Home" id="cmi0" 
                                              styleClass="centerTop centerTopSub"/>
                          <af:menu text="Menu with subitems" id="m2"
                                   styleClass="centerTop">
                            <af:goMenuItem text="subitem 1" id="gmi1" styleClass="centerTop"/>
                            <af:goMenuItem text="subitem 2" id="gmi2" styleClass="centerTop"/>
                            <af:goMenuItem text="subitem 3" id="gmi3" styleClass="centerTop"/>
                          </af:menu>
                          <af:commandMenuItem text="" id="cmi1"
                                              styleClass="centerTop" />
                          <af:commandMenuItem text="" id="cmi2"
                                              styleClass="centerTop" />
                          <af:commandMenuItem text="" id="cmi3"
                                              styleClass="centerTop" />
                          <af:commandMenuItem text="" id="cmi4"
                                              styleClass="centerTop"/>
                          <af:commandMenuItem text="" id="cmi5"
                                              styleClass="centerTop"/>
                        </af:menuBar>
                  I hope this can help you.
                  • 6. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                    shaz90
                    Hi thanks for the reply....

                    my requirement is to change the background color of commandMenuItem(used in pageTemplate) on clicking it....that takes to different page which has same template.............
                    the css u provided doesnt do that
                    • 7. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                      user404
                      Ow sorry, my bad.
                      You could just change :highlighted to :selected or :active .

                      I think the reason that your code isn't working is because you change the background of the normal state of your commandMenuItem.
                      When you click or hover the commandMenuItem it will get an other state (hover, highlighted, selected, active, ...) and an other (default) css so your own css is temporary lost until it gets his default state back.
                      • 8. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                        shaz90
                        yeah u are correct...... is there any way that i could use to achieve my requirement?
                        • 9. Re: Problem in setting inLineStyle to a commandMenuItem  programmatically
                          user404
                          You will need to set styleClass instead of inlineStyle (like the code I posted few posts back).
                          If you want to set the background-color, then chances are big that you need to add this:
                          background-image:none;
                          before
                          background-color:Color;