date form with placeholder

  • Hello,

    i want to find a solution to use the date field with a placeholder text, but on any browsers the show me only the

    TT.MM.YYYY

    and on iPhone/iPad nothing, thats a mistake (while empty)…the field was underlined to the icon near by.
    I hope it gives a solution to put text inside (via placeholder).

    many thanks
    Tilo

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter Tilo

    (@netsales)

    Hello,

    nobody has an idea how to place a text into the date field?…that it does not show an empty field or “TT.MM.YYYY”
    Unfortunately, Watermark is not a solution.

    thanks a lot
    Tilo

    Thread Starter Tilo

    (@netsales)

    plz, i need some help…

    Is there no option to set a placeholder in date field with CF7 and datepicker, like that?
    The use the placeholder code:

    <input name=”From” data-format=”LT” data-locale=”de” data-validation=”” data-err-msg=”” class=”form-control” placeholder=”Datum” autocomplete=”off” style=”font-size: 14px; height: 40px; border-radius: 4px;” type=”text”>

    To set it manually with a text-input-date like that

    …”2018-01-01″]

    is not an option, if a have set min and max date.

    How can i get only time (note date) in CF7?

    date-format:LT

    I can not believe it … a very good Pluin, but support…mhhh

    thanks
    Tilo

    • This reply was modified 6 years, 11 months ago by Tilo.
    Thread Starter Tilo

    (@netsales)

    Please help me…
    …is there realy no chance to set a placeholder on date field?
    Nothing work on me

    [date* datetime-1 date-format:DD.MM.YY min:today max:today+14days placeholder”Date”]

    I can set a fix date like this

    [date* datetime-1 date-format:DD.MM.YY min:today max:today+14days “2018-01-01”]

    but it is no solution, if was the date further as now.
    An solution was to set the fix date to

    [date* datetime-1 date-format:DD.MM.YY min:today max:today+14days “today”]
    …but that does not work.
    The Problem is on mobile devices. They show an empty field an the field was underlined as the other one.

    I woud like to find a way to set an placeholder on date field, as the same as the other fields (selector, inputs) like this.

    I hope there ist anybody out there how can help me…

    Thanks Tilo

    I am facing same problem and think that if the filed type is date we may not use any text placeholder. But it is also complex to keep there default date format in contact form 7 date field. I used a plugin that name “Contact Form 7 Datepicker” and it solved my problem. Hope this plugin can help you.

    Hi,

    I found a workaround using CSS, with custom CSS feature and ::before pseudo element

    .wpcf7-form-control-wrap.dates input::before {
	content: "Dates souhaitées";
	margin-right: 10px;
}

    That will display “Dates souhaitées jj/mm/aa” in the field before anything is selected, and then “Dates souhaitées 10/10/19” once a date is selected.
    Not the perfect solution, but still providing a better user experience !

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘date form with placeholder’ is closed to new replies.