Datepicker issues

UI Components for JSF
Post Reply
Just-Dominic
Posts: 1
Joined: 31 Dec 2021, 08:14

21 Jan 2022, 11:31

Hi,

I am new to PrimeFaces and I am trying to center the datepicker. I tried everything( i think) but for some reason I can't get it to work.
I want the datepicker to center on the screen with an overlay behind it (just like a modal) after using the trigger-button. I've tried to use the ui-datepicker:before selector but that doesn't work because the panel needs to close when you click outside the panel.

I've also tried to add a div overlay element before the ui-datepicker with jQuery. But it needs to get triggered on button-click. No AJAX event to check if the panel is open or trigger button is clicked...

Any ideas?

Code: Select all

<div class="p-field p-col-12">
							<p:outputLabel for="searchFilterFormDob"
								value="Date of birth" />
							<div class="ui-inputgroup">
								<p:datePicker id="searchFilterFormDob"
									value="#{someValue}" showIcon="true"
									showOnFocus="false" mask="true" focusOnSelect="true"
									placeholder="Date of birth">
								</p:datePicker>
							</div>
						</div>

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

22 Jan 2022, 14:57

I am having trouble visualizing what you are trying to accomplish. Can you post a mockup or PNG of how you envision this and then maybe we can help you?
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 7 guests