Is the date range selector similar to the Google Analytics date range selector?

Question

I am creating a web application where the vast majority of our target audience is likely to have experience with Google Analytics - and there is a date range selector within this website. I was hoping to find a ready-made javascript / jquery date range selector for customization according to my needs, but I am not a fan of the stock version that jquery provides, since it lacks actual input, it only has two visual calendars. I have listed what I am looking for below.

What I would like:

• Select a start and end date for one calendar (preferably with two months shown).

• Enter the start and end date manually in the input field

• Highlight the selected date range (change the background color of dates within the "start" and "end").

• Pretty easy to get to CSS / layout elements

What I do not need:

• Timeline selector
• Compare with the past

Thanks for the help!

Answer 1

Jquery-uh-datepicker

http://jqueryui.com/demos/datepicker/#multiple-calendars

there is also a list of other plugins

http://www.bloggingdeveloper.com/post/8-Widely-Used-Calendar-Date-Picker-and-Time-Formatting-jQuery-Plugins-that-Web-Developers-Should-Know.aspx

Answer 2

jquery-ui-datepicker . , - http://www.eyecon.ro/datepicker/

, .

https://github.com/dangrossman/bootstrap-daterangepicker

Answer 3

I like this because of the quick selection of common ranges, such as the year to date, today, etc. The code looked pretty readable, so I guess it will be possible to rewrite it a bit to fit it with the use cases for the application.

http://www.filamentgroup.com/examples/daterangepicker_v2/