Is there any support for a datepicker yet? Thanks.
Nothing yet, but you can use the built in <input type="date"> which will open in a native date picker. Does that help?
1 Like
Yeah that was perfect thanks!
Have you got a solution for the darkened datepicker in iOS7? I think the document behind the datepicker is black and the transparency of the datepicker is making it look dark…
Hey @gregorypratt I’m not seeing that on my end, do you have a screenshot or sample code? Thanks.
http://i.imgur.com/D26HJDp.png - this might help explain! I suspect it might be out of your control though!
Actually this might solve my problem: https://build.phonegap.com/plugins/332
1 Like
ah, I see. You could also just try setting body and such background colors:
body, html { background-color: #fff; width: 100%; height: 100%; }
using the date input type doesn’t appear to work in Android. At least 4.3-.
4 Likes
I’'am also facing same issue. Any body got the solution for this issue
using the date input type doesn’t appear to work in Android. At least 4.3
The ios-behaviour (to show a datepicker for input type =“date”) is a standard ios-webstackbehaviour and its independent from ionic. Android doesn’t have such a implementation out of box. So you have to use a Plugin to get things work like you would expect it on ios. I use this one, but there are couple of other DatePickers out there:
Hello,
I had also faced same problem in android. But now i get rid of it using angular-datepicker.
I have created demo app in github that use angularjs datepicker. take a look at it…it may help you…
https://github.com/joshilomas/DatePicker-IonicApp
Regards,
Lomas Joshi
3 Likes
Hi Lomas,
It looks great. Any plan to include time picker?
What’s the story with Android <input type="date"> ? I’m also on Android 4.3 and this is how it looks for me:
The date picker input type defaults to a regular text input, plus the label disappears – no idea why? Seems OK in Android simulators e.g. Nexus 5, but this is on a real device and it looks horrible and doesn’t work correctly.
Ah, the joys of platform woes…
Does anyone know why <input type="date"> doesn’t work on Android 4.3, and is there a workaround?
Also,
- Why did my label disappear
- Why is the
<input type="range">all screwy with the layout – whereas on Nexus 5 simulator it looks good?
Here’s the bit of markup for this page, some of the inline styles were workarounds for issues on iOS
<div class="list">
<label class="item item-input item-select item-stacked-label filter-select-label" style="padding-top: 10px; padding-bottom: 10px;">
<span class="input-label filter-select-span">Location</span>
<select
class="filter-select"
ng-model='location',
ng-options='location as location.name + ", " + location.city for location in locations | orderBy:"name" track by location.location_key'>
</select>
</label>
<label class="item item-input filter-date-label" style="padding-right: 25px;">
<span class="input-label filter-date-span">Date</span>
<input class="filter-date" type="date" ng-model='range.endDate'>
</label>
<label class="item item-input filter-range-label">
<span class="input-label filter-range-span">Days:<sup class='asterisk'>*</sup> {{days}}</span>
<input class="filter-range" type="range" name="days" min="0" max="30" value="7" ng-model="days" style='margin-right: 30px;'>
</label>
<p class="padding small">
<span class="small"><em class='asterisk'>*</em>How many days prior to the date you have chosen show in the chart.</span>
</p>
</div>
I guess the more apt question here is: does ionic have .platform-specific css classes that I can use when on a particular platform, b/c it looks like I’m going to be spending a good deal of time tweaking this css for the different platforms and devices…ugh.
2 Likes
The reason for this is that android 4.3 doesn’t support input type=“date” fields. Using a separate plugin or angular directive seems like a solution but I’ve yet to try that.
http://caniuse.com/#feat=input-datetime
2 Likes
I just started to develop an iOS likewise date-slider for Ionic!
Looks like this:
https://xorox.io/wp-content/uploads/2015/04/ionic-ios-dateslider-400x280.jpg
Free to use. Find the repo here: https://github.com/xorox/ionic-ios-date-slider
Hi @seanhill, I have created both time picker and date picker for ionic frame works.
This may help you. Please have a look at the below links.
3 Likes
Native datepicker / timepicker allways opens with current date/time . it is possible to make it open with ng-model value?
I have forked Rajesh’s datepicker and modified it to with a dropdown for month and year
i cant click the month and year to change it