A date picker for ionic framework applications

demo
1

I have created a demo app for date picker in ionic frame work applications. No additional plugins required.

Check out the below links

View project @ Github

View Demo

Screen shots
Date picker buttons   Date picker modal

You can also use have a look at the ionic-timepicker bower component, which i have created earlier.

Suggestions are welcome.

12 Likes
2

Hi Rajesh,

It looks really good. Kindly can we make more responsive.

3

Hi @milindsaraswala, I have used the native ionic framework’s popup here. It is by default responsive. I have also tried this date picker for both desktop and mobile devices and it is working fine.
What do you mean by responsive in your aspect? Am i missing some thing?

4

is there any config or something to disable date after or date before .??

5

Rajesh does it include the selection of time too after the date getting selected?

6

Hi @adhadimas91, as of now there is no such functionality. I will try to implement this functionality in the future releases.

7

Hi @anshulklr, This is just a date picker. I have also implemented the ionic-timepicker. You can use that bower component if required. But this doesn’t include time picker.
Check out the below link for my time picker component.

8

Rajesh i can’t include two things in the same field. I want something in which after selecting the date the time field comes and you can select the time too with the date?
Do you have any idea about this?

9

Great work, a really elegant solution :slight_smile:

10

@CT14_IT, Thanks a lot.

11

Hi @rajeshwarpatlolla. Appreciate excellent work. But it will remember the month even thought I don’t click Set button. For example I am on 4/24/2015 and click date button. switch the month to 3/24 then click Cancel. Click the date button again and then click left month switch button it will be 2/24(should be 3/24). Can you fix it?

12

oke thanks @rajeshwarpatlolla

13

Hi @Gary1990, i will look into it. Thanks for finding this issue.

14

Hi @Gary1990, The issue has been fixed and released a new version v0.1.1

15

Thank you for your quick response. :smile:

16

@rajeshwarpatlolla : Great addition, definitely going to use it!

I think by “more responsive”, @milindsaraswala meant faster, as the component exhibits a bit of lag… I also would make the “month changers” just a bit larger and support arrow keys and enter…

Cheers,

17

@rajeshwarpatlolla : min-date and max-date attribute options would be great.

You could also add a special ‘cssClass:’ property so that we can easily control the size of the popup modal without having to change your code.

18

Hi @jason_engage, that a good idea, i will try to implement in the upcoming release.
Thanks for the suggestion.

19

@rajeshwarpatlolla congrats man.
Thank you very much.

20

@rajeshwarpatlolla - It looks gorgeous, but it isn’t accessible. Do you have any plans to make it accessible?