Placeholder attribute not working on input type "date"

ionic-v1
1

I noticed that the placeholder text does not show up when I set the input type to date. Is this a bug?

      <label class="item item-input">
        <input type="date" placeholder="When?" ng-model="invite.when">
      </label>
2

It’s an AngularJS thing : http://codepen.io/calendee/pen/jEvuh

3

This helped me, it is not clean but it did the job:

<input placeholder="Date" class="textbox-n" type="text" onfocus="(this.type='date')"  id="date">

source: http://stackoverflow.com/questions/20321202/not-showing-place-holder-for-input-type-date-field-ios-phonegap-app

1 Like
4

This doesn’t trigger when clicking “done” on the previous field. When switching to the next (date) field, it still thinks it’s a text field. Is there a way to fix that?

5

Does it work correctly when you open it from nothing? So not from within the previous field, but from a normal page content?

EDIT: reason why I’m asking is becasue date fields are not supported on all browsers and platforms. Refer to http://caniuse.com/#search=date to notice the very limited support.

6

For me, on ios7 iphone it doesn’t work when starting from nothing. It shows the placeholder, but when clicking it to change the type to date, it jumps to the next element in my form in stead of showing the calendar…

It only works when trying to click on the element a second or third time.

7

i think the placeholder for date attributes has to be a date string also, for somebody could help, i did it like this:

  <label class="item item-input">
       <span class="input-label" ng-if="!user.birthdate" style="color: #aaa;">Birth Date</span> 
            <input type="date" ng-model="user.birthdate">
  </label>
4 Likes
8

Thanks for that! :grin: