4 Replies Latest reply on Feb 9, 2011 5:52 AM by wyattearp

    a4j:commandbutton - different image on disabled=true

    wyattearp

      Hello,

       

      I'm using an a4j:commandbutton with an image. Now I want to use a different image when this button is disabled: on disabled=false my normal green check-symbol is shown, but on disabled=true it should show the same image greyed out. Is there any possibility to do this? Unfortunately neither the RichFacesDocumentation nor Google were my friend this time ...

       

      Thanks in advance,

      WyattEarp

        • 1. a4j:commandbutton - different image on disabled=true
          ajanz

          Hello,

           

          you must use the html style / css

           

          for example

           

           

          INPUT[disabled][type='submit']

          {

              BORDER-BOTTOM: #999999 1px solid;

              BORDER-LEFT: #999999 1px solid;

              PADDING-BOTTOM: 4px;

              PADDING-LEFT: 16px;

              PADDING-RIGHT: 16px;

              BACKGROUND: url(../img/button1.gif) #ffffff repeat-x center 50%;

              COLOR: #666666;

              BORDER-TOP: #999999 1px solid;

              FONT-WEIGHT: normal;

              BORDER-RIGHT: #999999 1px solid;

              PADDING-TOP: 1px;

              -moz-border-radius: 4px

          }

          • 2. a4j:commandbutton - different image on disabled=true
            ilya40umov

            Please provide some sample of your code how you are using a4j:commandbutton with an image.

            • 3. Re: a4j:commandbutton - different image on disabled=true
              akaine

              For older browsers compatibility (css selectors like input[disabled], etc. are still not working everywhere) just use two styles:

              <a4j:commandButton styleClass="#{bean.btndisabled?'class1':'class2'} disabled="#{bean.btndisabled}" >
              
              • 4. Re: a4j:commandbutton - different image on disabled=true
                wyattearp

                Hello again,

                 

                I solved my problem now with a combination of two suggestions. Unfortunately the CSS-solution didn't work (or maybe I was too stupid to make it working).

                 

                My xhtml-code looks like the following:

                 

                <a4j:commandButton

                                    image="#{bean.butDisabled ? '../../resources/pics/img_grey.png' : '../../resources/pics/img.png'}" />

                 

                 

                Thanks for your help ...

                WyattEarp