set the date and time to current date and time - javascript

I want to limit the user from selecting the current date and current time.
What I have tried is:
<input id="datefield" type="date" />
<input type="time" id="timefield" class="form-control" />
var today = new Date();
var thishr = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
var hr = today.getHours();
var mn = today.getMinutes();
if(dd < 10){
dd = '0' + dd
}
if (mm < 10){
mm = '0' + mm
}
today = yyyy + '-' + mm + '-' + dd;
thishr = hr + '-' + mn;
document.getElementById("datefield").setAttribute("max", today);
document.getElementById("datefield").setAttribute("min", today);
document.getElementById("timefield").setAttribute("max", thishr);
document.getElementById("timefield").setAttribute("min", thishr);
Seems like the JavaScript for the date part is working, but the part for the time is not working as expected. Did I miss some important part?

first:
hr and mn have to include leading zeros, and the separator should be a colon, not a hyphen. like this : "08:05".
second:
put your input into a form element with a submit button. you will still be able to select any time, but when you will try to submit the form, the validation won't let you if the selected time is out of range.

Related

How to extract the date value from input type date using jquery?

Here I want to extract the date value from the above element. and compare it with the today date but it is giving error.
Do this to get today's date:
`var today = new Date();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = today.getFullYear();
today = yyyy + '-' + mm + '-' + dd;
document.write(today);`
For the input it will always have the same rendering: "yyyy-mm-dd":
var dateControl = document.querySelector('input[type="date"]');
dateControl.value = '2017-06-01';
So if you edit it in first way in this format you will be able to compare them ;)

How can i add a day to check-out?

I am doing a check-in/check-out datepicker. Check-in date picker is working but the problem is that the check-out one is allowing me to select check-in (and of course is not possible to check-out in the same day of check-in). So i want to add a day to check-out but i dont know how...
Can someone help me
This is the code i have:
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
today = yyyy + '-' + mm + '-' + dd;
document.getElementById("datainicio").setAttribute("min", today);
document.getElementById("datainicio").onchange = function () {
var input = document.getElementById("datafim");
input.min = document.getElementById("datainicio").value;
}
<div class="col-md-4">
<h4>Data Inicio</h4>
<p><input type="date" name="datainicio" id="datainicio"></p>
</div>
<div class="col-md-4">
<h4>Data Fim</h4>
<p><input type="date" id="datafim" name="datafim"></p>
</div>
Translations:
datainicio=check-in
datafim=check-out
Would momentjs be helpful to you? It is a small load to carry, but VERY helpful with dates in js.
Your code would then be something like this...
checkin = moment( pickeddate ).format( "YYYY-MM-DD" );
checkout = moment( pickeddate ).add('days', 1).format( "YYYY-MM-DD" );
Just a thought.

how to show today's date in html date type

I have form and I want to set today's date in one field.
<input id="starttdate" type="date" name="startdate">
and I want to set today's date in this field, means that when this form open it show today's date in this filed by default.
My javascript code is this
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd;
}
if (mm < 10) {
mm = '0' + mm;
}
var today = mm + '/' + dd + '/' + yyyy;
document.getElementById('starttdate').value = today;
<input id="starttdate" type="date" name="startdate">
in php just give value=date("Y-m-j")
<input id="starttdate" type="date" name="startdate" value="<?php echo date("Y-m-j"); ?>">

Only want javascript to execute on a specific Rails view

I've got some coffee script in /assets/javascripts/transactions.coffee that populates a text field (in /views/transactions/_form.html.erb) with today's date in dd/mm/yy format.
$ ->
today = new Date
dd = today.getDate()
mm = today.getMonth() + 1
#January is 0!
yyyy = today.getFullYear()
if dd < 10
dd = '0' + dd
if mm < 10
mm = '0' + mm
today = dd + '/' + mm + '/' + yyyy
$('#transaction_date').val today
$ ->
$('#transaction_date').datepicker({dateFormat: "dd/mm/yy"})
Currently, that form is referenced in /views/transactions/new.html.erb and /views/transactions/edit.html.erb. However, I only want the text field to be populated on new.html.erb and not edit.html.erb.
What's the 'cleanest' way to achieve this in Rails (4.2.5)?
Maybe you can create functions in transactions.coffee that you call from your view with an inline script. For example, in transactions.coffee
this.App || (this.App = {})
this.App.Transactions =
runForNewView: () ->
today = new Date
dd = today.getDate()
mm = today.getMonth() + 1
#January is 0!
yyyy = today.getFullYear()
if dd < 10
dd = '0' + dd
if mm < 10
mm = '0' + mm
today = dd + '/' + mm + '/' + yyyy
$('#transaction_date').val today
Then for example in the new view template, you would just add
<script text="text/javascript">
$(function() { App.Transactions.runForNewView(); });
</script>

How to use alert if the system date is changed?

How can I use alert if the date of system is changed in javascript. The date can be change manually of automatically.
[Thought is, Mainly client want to get an notification after day of end and start of the day. Total sales of today will be notified to the client when tomorrow is starting. like if the date of 30 and when it will be 31 and mail will be send to the client that you have sold sum quantity yesterday or date of 30]
Here I have tried this code. I am new in javascript so suggestion is needed.
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
today = mm + '/' + dd + '/' + yyyy;
$("#today").change(function () {
alert(today);
});
You cannot listen to the event like you a trying, the only way you can do this is with a synthetic event that is fired when the date changes:
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
var changedate = function(date, to){
date = to;
document.trigger('dateChange');
}
document.on('dateChange', function () {
alert(today);
});

Categories

Resources