Add placeholder text for Widgets

  • MJLLC
    Asked on February 23, 2018 at 12:23 AM

    Hello all,

    Is there a way inject CSS that adds placeholder text for both the Date Picker and Dropdown widgets? What would that look like?

    Thanks in advance!

  • Victoria_K
    Replied on February 23, 2018 at 5:56 AM

    Actually, you can not add placeholder values with just CSS. 

    I'm not sure if it is what you're looking for, but there is a workaround to add some text and position it over the input field. 

    I have cloned one of your forms, which you might refer to, to show the result.

    Here is the code I used for Datepicker field:

    #cid_6:after {

      content: "Placeholder";

      position: absolute;

      left: 10.5em;

      top: 1.8em;

    }

    1519382912Board and Take Flight   Opera Screenshot 10

    Please note, that the fake placeholder needs to be positioned somewhat right, in order to avoid overlapping the picked date.

    Despite all mentioned above, I encourage you to use "Show Today's Date" at DatePicker widget and "Show Text in Empty Option" at OPTIONS tab of dropdaows for placeholders of these fields. 

    1519383269Screenshot 2 Screenshot 211519383285The Easiest Online Form Builde Screenshot 32

     

    Let us know if you need further assistance.