[FIXED] On click Icon Open Calendar


Hello guys I’m using the component p-calendar of primeNg and I want to know if is possible to remove the input that appear to open the calendar and instead of this input add only an Icon. I mean, when I click above the Icon the calendar should appear but not when I put the mouse inside the input because I don’t want the input that primeNg add by default.

I don’t know if this is possible. Thank you very much.


There is inputStyle and icon properties where u can set width and as ur styles.

     <p-calendar [inputStyle]="{'width':'0px', 'border':'0'}" 
[showIcon]="true" icon="fa fa-user"></p-calendar>

see the reference for properties here https://www.primefaces.org/primeng/#/calendar

Answered By – rajhim

Answer Checked By – David Goodson (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published