5 Replies Latest reply on Apr 14, 2011 9:30 AM by stalwart.singh

    How to change the calendar icon

    stalwart.singh

      Hi,

       

      How do I change the icon next to the inputText in calendar? Can you please help me

        • 1. How to change the calendar icon
          ajanz

          use the buttonIcon attribute

           

          <rich:calendar  value="#{Page.dokdatum}" datePattern="dd.MM.yyyy"  inputStyle="width:80px"  inputClass="input_write"  buttonIcon="/img/bt_kalender_aktiv.gif" />

          • 2. How to change the calendar icon
            stalwart.singh

            I tried using  buttonIcon="true" in <rich:calendar> to disable the default calendar image.

            <rich:calendar  styleClass="pop-calender-exterior"  buttonIcon="true" />

             

            Now I am getting the image of the calendar which i have set in the css(image is at extreme right):

             

            .rich-calendar-button{

              background-image:url("../images/calen_icon.jpg");

                }calen_icon.jpg

             

              But the prob is that the image is not coming up properly. There is a red cross mark above this pic when it's appearing. I am attachin the snapshot herewith.

             

             

             

             

            As you can clearly see a red cross mark over the image next to the date entered.

             

            Please help me deleting the cross mark using css.

            I tried entering

            background-position:top;

            in css but it doesnt work.

             

            If I use

            background-image:none;

            then a red cross mark appears which is default image.

             

             

            Any solution to this?

            • 3. Re: How to change the calendar icon
              stalwart.singh

              Sorry..Could not upload the image above.I am attaching herewith.

              • 4. How to change the calendar icon
                ppitonak

                Hi Ajit,

                 

                I still cannot see you screenshot. Please follow instructions Sascha provided above. Calendar's attribute buttonIcon should be set to image's path.

                 

                Regards,

                Palo

                • 5. Re: How to change the calendar icon
                  stalwart.singh

                  Thnx a lot Sascha and Pavol. The css is working properly and I got the  desired output.