0

The problem I'm having is .focus() doesn't pull up the mobile datepicker, as my input type is 'date'.

Therefore I tried to have trigger('click tap') on the input box and that doesn't work either.

To reiterate, on my desktop it works fine, the box gets focused, but on a phone (mobile safari) the box is focuses BUT no datepicker shows up. This datepicker/spinner is the default html5 in mobile browsers, AFAIK. 

<form id="mobileAgeGate" onsubmit="return false;">
    <input id="mobileDate" type="text" onfocus="this.type='date'" onblur="this.type='text'" name="date" min="1900-01-01" class="date-mobile" placeholder="mm/dd/yyyy" pattern="(?:0?2[/.-](?:[12][0-9]|0?[1-9])|(?:0?[469]|11)[/.-](?:30|[12][0-9]|0?[1-9])|(?:0?[13578]|1[02])[/.-](?:3[01]|[12][0-9]|0?[1-9]))[/.-][0-9]{4}">
</form>

And the js, inside the document ready as normal:

if ($('#mobileDate').length) {
  setTimeout(function() {
  // $('#mobileDate').focus();  // This one works (but no mobile spinner pops up)
  // $('input[name="date"]').focus();  // This one works (but no mobile spinner pops up)

  $('#mobileDate').css('background-color', 'gray');  // to test something is indeed happening; ok
  $('input[name="date"]').trigger('click tap mouseover');  // This doesn't even focus
}, 3000);

}

The timer isn't really important to the question, but it's there to wait a little before the (if I could get it to work) datespinner pops up.

Many thank yous for any help or thoughts! - Chris

aymm
  • 57
  • 1
  • 5
  • Why are you using javascript to set the type. Why not just make the type date the whole time? – Leeish Sep 17 '14 at 22:16
  • The design I'm working with uses a placeholder to show mm/dd/yyyy, which doesn't show if type="date" so that's a workaround – aymm Sep 18 '14 at 14:33
  • http://stackoverflow.com/questions/18146350/how-do-i-simulate-placeholder-functionality-on-input-date-field Good suggestions there. Changing the type seems like the less good option. – Leeish Sep 18 '14 at 15:02
  • And why use a place holder when they will have to use a picker anyway. Usually the placeholder is great for user input but since this will be a picker, no need right? – Leeish Sep 18 '14 at 16:04
  • I agree Leeish but it's a client specification I can't get around – aymm Oct 01 '14 at 17:18

0 Answers0