225
Views
4
Comments
Solved
placeholder not working for input type date

Hi,

I have two date input fields - From Date and Start Date. I need to pass placeholder in them instead of label. I tried to add some text in Prompt property, but it still shows as "mm/dd/yyyy". I tried the solution mentioned here. It works for placeholder, but now it doesn't show the selected date in the field. Please find below video for reference. I've added the css in the mentioned solution for From Date but not for End date.

The image is of End Date (for Start Date - i've added CSS from the link mentioned) : 

Regards,

Aman

kpicharts.webm
2026-03-12 06-20-48
KUNDAN CHAUHAN
Champion
Solution

Hi Aman Devrath,

After add Css in stylesheet you need to add style classes condition also in Input widget .

In the screenshot which you share , you did not apply style classes condition as mention the link post.

You need to add  this condition :   If(ToDateVar=NullDate(),"DatePlace","form-control") 

 on style classes property of  date input widget .



So first of all remove the widget Style classes


and Add this condition in Style Classes :



as per your requirement i create a test screen please check it also :

https://personal-x1ixzlcz.outsystemscloud.com/TestApp1/Test?_ts=637935908710075343

Hope it help you 

Thanks


2024-04-15 16-08-47
Aman Devrath

Hi,

Thank you for the reply. This was a mistake at my end. It's fixed now. But there are still some css issues that I will fix. 


Actually, I wanted to know if there's any other way (simpler than current) to add placeholder for date inputs. This adding css and changing style classes is a lengthy way.


Regards,

Aman Devrath

2023-10-21 19-42-11
Tousif Khan
Champion

Hello,

You can achieve this with a JavaScript,

You just have to call JavaScript on , OnReady action

I am attaching a working Example, code snippet and Oml, so that it will help

Working Example - https://personal-ejuytnht.outsystemscloud.com/DatePicker/Screen1?_ts=637936058458715611

Js Snippet


I hope this will help

Thanks

Tousif

Sample_DatePicker_.oml
2024-04-15 16-08-47
Aman Devrath

Hi,

Thank you for the reply. But the input type is text and you have used date picker (with text input's ID passed). It doesn't work for input with type date. (select input, change its type to Date).


Regards,

Aman Devrath

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.