Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Stian Langum
Stian Langum
348 Points

How do I limit the date to 14 days using javascript

Hi, im making a Form using html and validating it with javascript. Im currently trying to limit a date picker to max 14 days.

Im using two <input type="date" name="Datefrom"/> And i want the next date to maximum 14 days forward.

Any tips?

  • Stian
Richard Duncan
Richard Duncan
5,568 Points

Hi Stian, can you post some code please? :)

2 Answers

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Use the datepicker widget in the jQuery UI project.

working demo: http://codepen.io/jamesbarnett/pen/jEOQoO

Richard Duncan
Richard Duncan
5,568 Points

Yes to be honest I would use something like that too unless you really want to do it the hard way with vanilla JS e.g. if you're not allows to use a third party lib. It just makes life a lot easier!

Marty Hitchcock
Marty Hitchcock
13,108 Points

This one featured on the Treehouse Show not too long ago: http://bevacqua.github.io/rome/

Much nicer than the jquery UI one I think.

Stian Langum
Stian Langum
348 Points
Stian Langum
Stian Langum
348 Points

I've gone for the jQuery datepicker <input type="text" name="Date" id="datepicker"/>

and im using the function

$(function() { $( "#datepicker" ).datepicker({ minDate: 0, maxDate: "+13D" });

});

But what i want is to make the second datepicker limited to 14 days ahed of what you pick from the first datepicker?

Stian Langum
Stian Langum
348 Points

so i'm thinking i have to extract the value form datepicker1 and put it in to "minDate: valueOfDatepicker1, maxDate: "+13D}); But i dont know how