I'm building a form to standardize filenames (I'm a video editor). After a lot of research, copying, pasting and testing I'm almost there. I just need to display the current date at the end of the filename after the user clicks on the corresponding checkbox.
The HTML has the code to get the current date and to format it as I want (YYMMDD), but for the life of me I can't find a way to display it at the end of the filename. The code to display the date works because I can enable/disable text, but I can't display the result of the todaysdate function.
This is the code to get the current date and format it to YYMMDD:
function SetDate()
{
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear() - 2000;
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + month + day;
document.getElementById('today').value = today;
}
This is the code that adds or removes the date at the end of the filename when you click the checkbox.
function todaysdate()
{
var checkbox = document.getElementById('todayis');
if (checkbox.checked != false)
document.getElementById('todayis').value = "DATE";
if (checkbox.checked != true)
document.getElementById('todayis').value = "";
}
This is the code for the checkbox:
Add date (YYMMDD): <input type="checkbox" onclick="todaysdate()" id="todayis" value="" />
Thanks in advance for your help.
Edit: Added the code.
In your todaysdate function you set the value of the todayis input to DATE, where you should be setting it to the value of your date calculation. Here’s just a little change to what you have that should probably work!
function todaysdate()
{
var checkbox = document.getElementById('todayis');
if (checkbox.checked != false)
document.getElementById('todayis').value = getDate();
else if (checkbox.checked != true)
document.getElementById('todayis').value = "";
}
function getDate()
{
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear() - 2000;
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "" + month + "" + day;
return today;
}
You can also use the php function Time:
Set the timezone:
date_default_timezone_set('America/New_York');
And get the actual date:
$date_now = date('Y/m/d', time());
So, to set the value on the input:
<input type="checkbox" value="<?php echo $date_now ?>" />
function getYYMMDDDate(date) {
var year = String(date.getFullYear()).substring(2,4);
var month = String(date.getMonth() + 1).padStart(2, "0");
var day = String(date.getDate()).padStart(2,"0");
return year + month + day;
}
...
// change this document.getElementById('todayis').value = "DATE";
document.getElementById('todayis').value = getYYMMDDDate(new Date());
How do you display only when it's the last week of the month (the text below).
The DATE that will be displayed here is next month's first Monday.
"Due on DD/MM/YY"
To detect if this is the last week in month you can follow this example:
https://www.javatpoint.com/calculate-current-week-number-in-javascript
To get next monday, you can call this function:
getNextMonday(){
var date = new Date();
date.setDate(date.getDate() + (1 + 7 - date.getDay()) % 7);
return date;
}
You can use the below JS Code. It will show the alert on last week of month means from last monday of month.
function Get_Last_Monday_of_Month()
{
var year = new Date().getFullYear();
var month = new Date().getMonth() + 1;
var dat = new Date(year+'/'+month+'/1');
var currentmonth = month;
var firstmonday = false;
while (currentmonth === month)
{
firstmonday = dat.getDay() === 1 || firstmonday;
dat.setDate(dat.getDate()+(firstmonday ? 7 : 1));
currentmonth = dat.getMonth()+1;
}
dat.setDate(dat.getDate()-7);
return dat;
}
function Get_Next_Coming_Monday()
{
var date = new Date();
date.setDate(date.getDate() + (1 + 7 - date.getDay()) % 7);
return date;
}
var d1 = new Date();
var d2 = Get_Last_Monday_of_Month();
var d3 = Get_Next_Coming_Monday();
if (d1.getTime() >= d2.getTime())
{
var datestring = ("0" + d3.getDate()).slice(-2) + "/" + ("0"+(d3.getMonth()+1)).slice(-2) + "/" + d3.getFullYear();
document.write ("Due on " + datestring);
}
I have here a script to auto-input the current date on my input tag. However, I cannot add an auto timestamp like date.getHour(); as well. It's not working when I tried doing this.
Please take a look at the script I'm using:
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day;
document.getElementById('Date').value = today;
<form id="saveNote">
<textarea class="lined" id="textarea1" name="textarea1" spellcheck="true" placeholder="" onpaste="console.log('onpastefromhtml')"></textarea>
<input type="date" id="Date" name="Date"/>
</form>
<button onclick="save()">Submit</button>
All I'm looking for is a simple solution that will add a timestamp at the end of the day like "1/12/2021 - 02:00 PM" or even in 24-hour format.
EDIT: Here's my failed code:
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
var hour = date.getHours()
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day + "-" + hour;
document.getElementById('Date').value = today;
Thanks in advance!
change your input type like this.
<input type="datetime-local" name="Date" id="Date">
then use this js code to set current date.
var now = new Date();
now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
document.getElementById('Date').value = now.toISOString().slice(0,16);
I think you should change your input tag's type to datetime
<input type="datetime" id="Date" name="Date"/>
I am trying to restrict past dates in input type="date". I am able to restrict future dates, but how can I restrict past dates?
$(function(){
var dtToday = new Date();
var month = dtToday.getMonth() + 1;
var day = dtToday.getDate();
var year = dtToday.getFullYear();
if(month < 10)
month = '0' + month.toString();
if(day < 10)
day = '0' + day.toString();
var minDate= year + '-' + month + '-' + day;
$('#txtDate').attr('min', minDate);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" id="txtDate" />
You can try this
var maxDate = year + '-' + month + '-' + day;
alert(maxDate);
$('#txtDate').attr('min', maxDate);
$(function(){
var dtToday = new Date();
var month = dtToday.getMonth() + 1;
var day = dtToday.getDate();
var year = dtToday.getFullYear();
if(month < 10)
month = '0' + month.toString();
if(day < 10)
day = '0' + day.toString();
var maxDate = year + '-' + month + '-' + day;
// or instead:
// var maxDate = dtToday.toISOString().substr(0, 10);
alert(maxDate);
$('#txtDate').attr('min', maxDate);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" id="txtDate" />
Here is a PHP solution that gets today's date and sets it as the minimum.
<input type="date" id="txtDate" min="<?php echo date("Y-m-d"); ?>">
This will put it in the correct double-digit format for the day and month. https://www.php.net/manual/en/function.date.php
Programmatically you can do something like this to disable past dates from being selectable:
<input type='date' min={new Date().toISOString().split('T')[0]} />
The below code may help you. It is normal HTML5 code:
Enter a date before 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
Enter a date after 2000-01-01:
<input type="date" name="bday" min="2000-01-02">
See this working example.
In HTML:
<input type="date" id="ExpiryDate" class="form-control" min="9/10/2018"/>
Using Jquery new version:
function SetMinDate() {
var now = new Date();
var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);
var today = now.getFullYear() + "-" + (month) + "-" + (day);
$('#ExpiryDate').val(today);
$('#ExpiryDate').attr('min', today); }
<input type="date" id="date">
var date = new Date().toISOString().slice(0,10);
//To restrict past date
$('#date').attr('min', date);
//To restrict future date
$('#date').attr('max', date);
$(function() {
$(document).ready(function () {
var todaysDate = new Date();
var year = todaysDate.getFullYear();
var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);
var day = ("0" + todaysDate.getDate()).slice(-2);
var maxDate = (year +"-"+ month +"-"+ day);
$('.class_of_input_field').attr('min',maxDate);
});
});``
To select To date greater than from date we can use this code
$(document).on("change", "#from", function () {
debugger
var date = $(this).val();
$('#to').attr('min', date);
});
$(function(){
var dtToday = new Date();
var month = dtToday.getMonth() + 1;
var day = dtToday.getDate();
var year = dtToday.getFullYear();
if(month < 10)
month = '0' + month.toString();
if(day < 10)
day = '0' + day.toString();
var minDate= year + '-' + month + '-' + day;
$('#date').attr('min', minDate);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" id="date" />
If you are using laravel then just do it like this
<input type="date" name="start_date" required min="{{date('Y-m-d')}}" />
and for regular HTML just specify the date
<input type="date" name="start_date" required min="2022-07-18" />
in laravel 5.8,
<input type="date" class="form-control" name="from_date" id="from_date"required min="{{date('Y-m-d')}}" value="{{ old('from_date') }}">
here, i used min="{{date('Y-m-d')}}"
I've found this working (HTML) method. (i.e this works with only textbox with date mode, not with calendars or date-time pickers.)
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var today = new Date();
var month = ('0' + (today.getMonth() + 1)).slice(-2);
var day = ('0' + today.getDate()).slice(-2);
var year = today.getFullYear();
var date = year + '-' + month + '-' + day;
$('[id*=txtExpDate]').attr('min', date);
});
</script>
<asp:TextBox ID="txtExpDate" runat="server" TextMode="Date"></asp:TextBox>
I need to add months so I use date.getMonth() +8; and its a Saturday but I need to eliminate weekends. If I add these lines of code:
if(date.getDay() % 6)
var date.getdate()+1;
It doesn't work. So what can i do?
Here to fiddle https://jsfiddle.net/a3f3yb0s/
and here to snippet
var date = new Date();
var day = date.getDate();
var month = date.getMonth() +8;
var year = date.getFullYear();
var year2 = date.getFullYear() +1;
if(month>12) {
month=month%12;
year=year2;
}
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day;
document.getElementById('theDate').value = today;
<input type="date" id="theDate">
Why not just do the calculations on the date object and let the browser handle all the calendar calculations:
// get a date object
// 8 months from 2016-01-01 is a Saturday
var date = new Date(2016, 1, 1);
// add 8 months
date.setMonth(date.getMonth() + 8);
alert(date); // will show a Saturday
// check if it is a saturday
if(date.getDay() == 6)
{
// if it is then add two days
date.setDate(date.getDate() + 2);
}
alert(date); // will show a Monday