v4.0.0 super early demo

[amsul]

Hello, you lovely people.

Version 4 is on the way! And it’s got all sorts of awesome new stuff in it. Including date ranges and using it without an input element :smile:.

Another major upgrade is the picker now uses HTML Elements instead of strings to build out the templates. This results in huge performance boosts and faster rendering/paint times :+1:. This also allows the opportunity to easily customize the picker's template, for example to show two months in a view, etc.

The demo

The design is definitely not finalized, but you can take a peak here: http://jsbin.com/wanis/3/edit?html,js,output ...and the source code is here: https://github.com/amsul/pickadate.js/tree/4.0.0.

I’d love to hear your thoughts!


---

The main things remaining are:

• [x] Allow date ranges
• [x] Allow multiple dates
• [x] Allow multiple date ranges
• [ ] Allow disabling/enabling dates
• [ ] Add a method to check if a date is disabled
• [ ] Add keyboard controls
• [ ] Implement jQuery extension as closely to the current API as possible
• [ ] Finalize design
• [ ] Write documentation on new API

...and probably lots more. I’ll add more as I remember them.

[brunogaspar]

Looks sweet!!

The only thing i noticed that is a bit annoying (not even sure if it's possible to fix) is when you select multiple rows, like so http://d.pr/i/gn9J

I selected from day 4 to 24 and the first two rows got that selected text effect

[amsul]

Yeah, there is a simple way to fix it by preventing mousedown. I just left it for later. I'll add that in soon.

—

Sent from my phone

On Tue, May 27, 2014 at 11:15 PM, Bruno Gaspar notifications@github.com wrote:

Looks sweet!! The only thing i noticed that is a bit annoying (not even sure if it's possible to fix) is when you select multiple rows, like so http://d.pr/i/gn9J

I selected from day 4 to 24 and the first two rows got that selected text effect

Reply to this email directly or view it on GitHub: https://github.com/amsul/pickadate.js/issues/446#issuecomment-44361519

[brunogaspar]

ah awesome, good work so far, looks great =)

[amsul]

Thank you :)

[cjk]

:thumbsup: Navigation is much easier now. Looking forward to use the new version in my apps.

[ottob]

:thumbsup: looking forward to using it without input

[erlingur]

Ah looks great! I really like the month/year selection method, I've seen it in other pickers and it's very nice. Can't wait to use it! :+1:

[mauricenaef]

Do you have a rough timeline for disabling dates and or the rest? Need to choose the datepicker for a new project and would love to go ahead with this... thanks and great work!

[PatrickJS]

can we have multiple months features and date ranges that will highlight all the dates between the two http://jqueryui.com/datepicker/#multiple-calendars

[amsul]

@mauricenaef at the moment, the rough timeline for disabling dates is ~4-6 weeks.

@gdi2290 that's the plan! At the moment just the core exists, but the core can easily be extended to adding multiple calendar faces. There will be utility methods to do so.

[alexstanbury]

Have you considered removing the jQuery dependency?

[plumpNation]

Great work. Thankyou

[amsul]

@plumpNation, right back at you for #554 :+1:

@alexstanbury absolutely! In fact, I’d love to see PR that removes the dependency..

[machadoug]

@amsul I'm looking for a date picker with a small footprint (small size) and pickadate.js with date range will be great. Does it require shadow framework? Do you know when it will be released?

Thanks

[piehouserat]

any updates on when v4 might be out?

[xtianus79]

yes any update I need multiple calander dates for classic UI.

[gilbarbara]

hey,

is v4.0 still in development? I'd love to use this version but I need to disable dates and apparently v4 don't have yet. And 3.5.5 has it?

Thanks

[andrewmcgivery]

+1 for being able to have users only select a month/year. Any ETA?

[mylskfmn]

this is looking awesome, excited for the full release

[janurag]

Nice One :+1:

[arun057]

Any update on release?

[uxweb]

Wow!, this is the best datepicker I've used.

Have you considered use moment.js to manage the dates?, that will make this datetime picker the best!. Thank you!!

[asharma17]

I want to disable multiple dates in pickadate. and I am getting dates as array from database from this @holidays.collect{|holiday| [holiday.date]} Output comes from :- 2015-08-15,2015-01-26,2015-06-11 But I am not able to disable these days in pickadate. disable multiple dates is not working on official site (http://amsul.ca/pickadate.js/api/#method-get-disable) also . Please guide me how to implement this issue in pickadate?

[uxweb]

Wow, it looks so good!!, it is nice to have new features for this awesome date and time picker, i love it because it can be used for desktop and mobile apps.

Also it would be nice to implement some cool features this other datepicker has:

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

Cheers!

[arashmehmandoost]

SUGGESTION: This great version would become more popular if supports more calendars; Persian Calendar (also known as Jalali) is one of them.

[plumpNation]

Hi @amsul, was just wondering if there is any news on the v4 development?

[FaiqH]

Having a month/year selector similar to the bootstrap would be great. Especially, since I prefer this lighter more versatile version.

[JoannaFalkowska]

So what's up with this release? : )

[sharpmachine]

The last commit to the 4.0.0 branch was Nov 2014. Is this still is development? We're all anxiously awaiting an update because we all love the plugin.

[michaelsogos]

Any news about dev status?

[melih]

Congrats, looks awesome. What I am trying to do is to create a timepicker depends on what selected in datepicker. I think this one will resolve my problem.

[kisin]

does anyone still working on this version or is it dead?

[shavidzet]

awesome news, but first please checkout our pull requests :D

[rainmedia]

Did anyone make this verison work? It is a great calendar. But I would like to show the whole 12 months when the month, on top of the calendar is clicked. Please see this example

[theMadness]

Maybe a flag to allow customization using only data-attributes?