Time field placeholder not showing

At the moment, our Date/Time field doesn’t offer a built-in feature to set a default time, such as 12am. But there’s a workaround using our Advanced Datepicker add-on. By activating the “limit hours” option, you can set up a time range, and the initial time shown will be the earliest in that range, essentially serving a similar purpose to a default time setting.

For instance:

This approach could closely match what you’re aiming for. Should this solution meet your needs, I encourage you to get in touch with our Customer Success team for further details and assistance.

I think you misunderstood my question. I don’t want to show the default time 12:00AM. Currently, that’s what it is showing.
I want it to show “Select time” placeholder. Please check the screenshot.

I have set the placeholder from the form backend (as shown in the ss below) but it is not showing on the frontend.

Any help on this?

Hi @devrathankumar,

First, add a custom CSS class like “cs_placeholder_text” as shown in the screenshot below.

Now add the following jQuery code to your child theme JavaScript file or try the Simple Custom CSS and JS plugin. Make sure to have the settings similar to the screenshot below.

jQuery(document).ready(function( $ ){
	$('.cs_placeholder_text .hour.extra').prepend('<option selected disabled>Hour Text</option>');
	$('.cs_placeholder_text .minute.extra').prepend('<option selected disabled>Minute Text</option>');
});

Now, if you check the front end, you will find that both placeholder texts have been added as the first option in both Date/Time input fields.

Give it a try, and let me know how that goes! ??

• This reply was modified 9 months, 4 weeks ago by Faisal Ahammad. Reason: Custom jQuery added