.isAfter return even false - javascript

I'm using momentjs with Eonasdan plugin and I'm trying to check if the end date is less than the start date, for doing this I'm using the method isAfter:
var start = moment($('#start-datetime').val());
var end = moment($('#end-datetime').val());
console.log((start).isAfter(end));
this will return even false, the values are so defined:
start: 07/02/2019 19:58
end: 31/01/2019 19:58

Try passing a specific format string and locale to moment to make sure the string is parsed correctly:
moment(..., "DD/MM/YYYY HH:mm", "en");
or
moment.locale("en");
...
moment(..., "DD/MM/YYYY HH:mm");
Demonstration:
moment.locale("en");
$("#test-button").click(function() {
var start = moment($('#start-datetime').val(), "DD/MM/YYYY HH:mm");
var end = moment($('#end-datetime').val(), "DD/MM/YYYY HH:mm");
console.log((start).isAfter(end));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.23.0/moment.min.js"></script>
<input id="start-datetime" type="text" value="07/02/2019 19:58">
<input id="end-datetime" type="text" value="31/01/2019 19:58">
<button id="test-button">Test</button>

Related

how to convert jquery datepicker format to timestamp format like dd-mm-yyyy (28/09/2019 3:40pm)

I dont wanna manual convertion, i have the jquery datepicker v.1.12.1
if i select the date from datepicker it will automatically convert timestamp format.
i want a date format in timestamp like 28/09/2019 3:40 GMT-0400 this format to 1569668513 this format.
Can you please help me?
var dateString = '#referdate',
dateTimeParts = dateString.split(' '),
timeParts = dateTimeParts[1].split(':'),
dateParts = dateTimeParts[0].split('/'),
date;
date = new Date(dateParts[2], parseInt(dateParts[1], 10) - 1, dateParts[0], timeParts[0], timeParts[1]);
console.log(date.getTime()); //1379426880000
console.log(date); //28-09-2019 3:40 GMT-0400
You can try this.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<script>
function getTimeAndDate(){
let today = new Date();
let date = today.getDate()+'/' + (today.getMonth()+1) + '/'+today.getFullYear();
let h = today.getHours();
let m =today.getMinutes();
console.log(h+':'+m);
console.log(date);
}
</script>
<body>
<input type="button" onclick="getTimeAndDate()" value="Button">
</body>
</html>
Are you looking for the dateFormat option?
From the docs:
$( ".selector" ).datepicker({
dateFormat: "yy-mm-dd"
});
$( "#datepicker" ).datepicker({
dateFormat: "#"
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script
src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"
integrity="sha256-0YPKAwZP7Mp3ALMRVB2i8GXeEndvCq3eSl/WsAl1Ryk="
crossorigin="anonymous"></script>
<input id="datepicker">
If you just want to log the timestamp of the chosen date, you can get the javascript date object directly from the picker on change.
// however you initialize the datepicker does not matter
$("#datepicker").datepicker();
// when a date is picked the change event is fired
$("#datepicker").change(function() {
// get the date object
let theDate = $("#datepicker").datepicker("getDate");
console.log(theDate.getTime())
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js" integrity="sha256-0YPKAwZP7Mp3ALMRVB2i8GXeEndvCq3eSl/WsAl1Ryk=" crossorigin="anonymous"></script>
<input id="datepicker">

unable to set calendar start date in pikaday calendar

When i trigger the start date input box, I want to show the future or past month in calendar popup as a starting date in end date calendar.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://dbushell.com/Pikaday/css/pikaday.css">
<link rel="stylesheet" href="https://dbushell.com/Pikaday/css/site.css">
</head>
<body>
<input type="text" id="datepicker">
<br/>
<input type="text" id="datepicker2">
<script src="https://cdn.jsdelivr.net/momentjs/2.14.1/moment-with-locales.min.js"> </script>
<script src="https://dbushell.com/Pikaday/pikaday.js"> </script>
<script>
var picker = new Pikaday({
field: document.getElementById('datepicker'),
format: 'D MMM YYYY',
minDate: new Date(),
onSelect: function (date) {
picker2.setMinDate(date);
//picker2.???? to set the starting month of picker2 calendar
}
});
var picker2 = new Pikaday({
field: document.getElementById('datepicker2'),
format: 'D MMM YYYY',
minDate: new Date(),
onSelect: function () {
console.log(this.getMoment().format('Do MMMM YYYY'));
}
});
</script>
</body>
</html>
please check the above example, based on start day selection i want to trigger the end date calendar starting month. please suggest.
JS bin link
As I understand your question, you want to set the selected month in picker to the picker2 object. use the API onOpen.
Example
var picker = new Pikaday({
field: document.getElementById('datepicker'),
format: 'D MMM YYYY',
minDate: new Date(),
onSelect: function(date) {
//console.log(this.getMoment().format('Do MMMM YYYY'));
console.log('test ' + date);
picker2.setMinDate(date);
//picker2.setStartRange(date)
}
});
var picker2 = new Pikaday({
field: document.getElementById('datepicker2'),
format: 'D MMM YYYY',
minDate: new Date(),
onOpen: function() {
picker2.gotoDate(picker.getDate())
},
onSelect: function() {
console.log(this.getMoment().format('Do MMMM YYYY'));
}
});
When I worked with Pikaday package in Vue.Js project I had to set default date to my date field in form. I tried many different versions of setting default date. But they didn't work for me. Finally I found the solution for my situation. The solution was to set prop like auto-default="autoDefault" here autoDefault is equels to true to Pikaday component like this...
<vue-pikaday v-model='date' auto-default="autoDefault" :options="pikadayOptions" />
data() {
return {
autoDefault : true,
pikadayOptions: {
format : 'YYYY/MM/DD',
minDate : moment().toDate(),
},
}
},

javascript moment.js format date

I am doing in accordance with this question and I need to format my resulting time string. I use bootstrap datetimepicker and moment.js and I have this code:
$("#datetimepicker2").on("dp.change", function (e) {
console.log('date2: ' + e.date.format('MM.DD.YYYY HH:mm:ss') );
end_date = e.date;
end_date.toJSON = function(){ return moment(this).format(); };
});
console.log(JSON.stringify(end_date));
My problem is that I receive
"2017-06-20T17:29:05+03:00"
while I need something like this:
"2017-06-20T17:29:05.013Z"
Any ideas how to get it would be welcome. Thank you.
You can convert the moment object to js date and use toISOString() on that.
moment().toDate().toISOString();
You can add .tz() before .format() and pass in the timezone inside .tz("America/New_York"), etc.
$(function() {
$("#datetimepicker2").datepicker();
$("#datetimepicker2").on("change", function(e) {
console.log(moment().utc($(this).val()).format());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone-with-data.js"></script>
Date: <input type="text" id="datetimepicker2" />

Subtracting values to moment.js using input[type="range"]

I want to subtract dates to moment.js using input[type="range"] but it's not working correctly. Here is my code:
JS
<input type="range" min="1" max="30">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="moment.min.js"></script>
<script type="text/javascript">
<script>
var now = moment().format('MMM DD, YYYY - hh:mm a');
$('input[type="range"]').on('change',function(){
var timeValue = $(this).val();
now = moment().subtract(timeValue,'minutes').format("MMM DD, YYYY - hh:mm a");
console.log(timeValue);
console.log(now);
});
</script>
Your problem is that you params are wrong way around:
var now = moment().subtract('minutes', timeValue).format("MMM DD, YYYY - hh:mm a");
'minutes' is the first param in subtract and then the timevalue.
jsfiddle link
But Kalley's answer also fixes the issue.
You need to force the value from the input into an integer, as it's a string.
var timeValue = parseInt($(this).val(), 10);
FIDDLE

Showing Date in different format in javascript datepicker

I am new to JavaScript and I am trying to make a date-picker widget, I have the selected date in mm/dd/yy format,how can I get the date as "Thu(Day),25th July(Date,month) ,2013" kind of format and also how to set the input value to the current date.Here's my fiddle,
http://jsbin.com/idowik/3/
http://jsbin.com/idowik/3/edit
There are so much warnings , please bear with me and please open the output in new tab. Thank You,
Read the docs about the Date Object: http://www.w3schools.com/jsref/jsref_obj_date.asp.
Everything you need is described there.
Have a look at the following code:
<!DOCTYPE html>
<html>
<body>
<input id="dateInput" type="text"></input>
<button id="convertButton">Convert to string</button>
<a id="dateString"></a>
<script type="text/javascript">
var dateInput = document.getElementById("dateInput");
var button = document.getElementById("convertButton");
var dateString = document.getElementById("dateString");
var date;
button.onclick = function() {
var year = 2000+ parseInt(dateInput.value.split("/")[2]);
var month = dateInput.value.split("/")[0];
var day = dateInput.value.split("/")[1];
date = new Date(year, month, day);
dateString.innerHTML = date.toDateString();
}
</script>
</body>
</html>
This html page does exactly what you want.

Categories