How to set input field's max date from current date
You can try adding the max
attribute to the input but be aware that this can be modified in the browser.
<input type="date" name="date" min="<?=date('Y-m-d');?>" max="<?=date('Y-m-d',strtotime('now +1 week'));?>" />
Can't set max date on date input
min
and max
need to be in the format YYYY-MM-DD
. You're setting max
to something like Sat Nov 13 2021 18:14:51 GMT-0500 (Eastern Standard Time)
, which doesn't work.
Use toISOString()
just like you do for today
.
And setDate()
should be setMonth()
.
let today = new Date().toISOString().split('T')[0];
let date3m = new Date();
date3m.setMonth(date3m.getMonth() + 3);
date3m = date3m.toISOString().split('T')[0];
document.getElementsByName("start")[0].setAttribute('min', today);
document.getElementsByName("start")[0].setAttribute('max', date3m)
<div class="calendar">
<div>
<label for="start">Start Dato:</label>
<input type="date" id="start" name="start" required>
</div>
<div>
<label for="end">Slutt Dato:</label>
<input type="date" id="end" name="end" required>
</div>
</div>
How can I set min/max date to current date in HTML?
Keeping your way of doing it:
<input type="date" class="form-control" id="dob" max="{{date | date:'yyyy-MM-dd'}}">
You need to pipe the date to follow the input
format.
Related Topics
How to Make Div's Percentage Width Relative to Parent Div and Not Viewport
How to View an HTML File in the Browser with Visual Studio Code
Why Are My Div Margins Overlapping and How to Fix It
Equal Sized Table Cells to Fill the Entire Width of the Containing Table
Adding a Background Image to a <Div> Element
Fit Website Background Image to Screen Size
Bootstrap Print CSS Removes Background Color
How to Prevent the Padding Property from Changing Width or Height in CSS
How to Keep :Active CSS Style After Click a Button
Why Would Margin Not Be Contained by Parent Element
What Replaces Cellpadding, Cellspacing, Valign, and Align in HTML5 Tables
Multiple Forms or Multiple Submits in a Page
Min-Height Does Not Work with Body
How to Make the HTML5 Number Field Display Trailing Zeroes
Bootstrap 4 - Responsive Cards in Card-Columns