2

Using primereact calendar for both date & Time selection. code

<Calendar name="enddate"
          id="enddate"
          placeholder="End Time "
          style={{ width: "100%"}}
          inputStyle={{ width: "90%" }}
          showButtonBar={true}
          hideOnDateTimeSelect={true}
          showTime={true}
          showSeconds={true}
          hourFormat="24"
          showIcon={true}
          monthNavigator={true}
          value={this.props.enddate}
          ></Calendar>

output image attached

the problem is that the overlay is covering the input field. I tried a lot, but didn't find any props for showing calendar below the input field. I also tried custom styling but was not successful.

Any Suggestions or updates?

enter image description here

Apostolos
  • 10,033
  • 5
  • 24
  • 39
K Guru
  • 1,292
  • 2
  • 17
  • 36
  • 2
    can you please share codesandbox link ? – Arpit Vyas Jun 23 '20 at 08:40
  • this is a problem when the calendar popup doesnt have the space required to fully show on top or below the textbox. What i would suggest is to change the css in order to narrow the calendar popup height as a first step and see if this fits your needs. – Apostolos Jun 23 '20 at 13:35

0 Answers0