I am looking to try and calculate the number of days between 2 datepicker fields and display that value in an input field. I have searched a lot of different methods but can't seem to get any to work. I am using boostrap-datepicker.js
I have created a JS fiddle here http://jsfiddle.net/KLpq7/201/ so you can see my effort so far
My JS Is as follows
function days() {
var a = $("#datepicker_start").datepicker('getDate').getTime(),
b = $("#datepicker_end").datepicker('getDate').getTime(),
c = 24*60*60*1000,
diffDays = Math.round(Math.abs((a - b)/(c)));
$("#totaldays").val(diffDays)
}
$('.datepicker')
.datepicker({format: 'DD, dd.mm.yyyy'})
.on('changeDate', function(ev){
$(this).datepicker('hide').blur();
});
In the first part I am trying to achieve this, but it is not working!
Looking for some help...
I have modified your jsfiddle that correctly calculates the differences. One think I noticed is that you use the dd/mm/yyyy format and by default JS wants the dates as mm/dd/yyyy. It is best if you handle it the 'American' way for date difference calculations, but if you must use the 'correct' style of dd/mm/yyyy then I would recommend taking a look at the Globalize library.
function DateDiff(var date1, var date2) {
return date1 - date2;
}
Should work if you pass in two Date objects in Javascript. The result returned will be the number of milliseconds between the two, which can be quite easily converted to days or hours or weeks, etc.
Related
I am trying to calculate and display number of days between two dates in my React app.
However, while doing so, I am having issues converting the date from my date picker to a string? Do I even need to convert the date to a string before calculating? Here is what I have.
var numberOfDays = function({props.startDatePicker},{props.endDatePicker}){
return {
moment({props.startDatePicker}.diff({props.endDatePicker}, 'days'));
};
}
What am I doing wrong? Where should I place this code?
You need to call .diff() on a moment object. Try moving the close parenthesis around {props.startDatePicker}
moment({props.startDatePicker}).diff({props.endDatePicker}, 'days');
https://momentjs.com/docs/#/displaying/difference/
I am using a kendo datepicker where I want to disable all the wednesdays. The hacky way of doing this is to create an array of all wednesdays and then pass that list to Kendo.
There has to be a better way, either natively via kendo or a javascript function that generates all wednesdays for the current year and returns a list of the dates.
I am struggling with both approaches. Will appreciate any pointers in this.
TIA
Use disableDates: function (date) option and for disabling wednesdays simply return if day of week is 4 (days are zero based)
disableDates: function (date){
return date.getDay() === 4;
}
Or as noted in comments can use array of short day names
disableDates: ["we", "th"] // no wed or thurs
Is there an easy way in moment.js to compare times with no date attached?
It works when I have a full ISO object with date+time, but not when it's only a time.
For example, this basic code doesn't work because, I presume, it expects a date in the value:
var time_obj = moment(active_time_format, "HH:mm:ss");
console.log(time_obj.isBefore('12:00:00'));
I understand that I can just add an arbitrary date in there, but what is the elegant way to do this?
Update:
This works from the comment below by #RichardHamilton:
var time_obj = moment(active_time_format, "HH:mm:ss");
console.log(time_obj.isBefore( moment('12:00:00', "HH:mm:ss") ));
I'm using JS to pull content from a table and create event list items on a page.
Im using Date.parse to compare the entry date to todays date, and only show events in the future, based on MM/DD/YY value from var eventDate.
<script>
today = new Date(); today.setDate(today.getDate() - 1);
eventDate = $(this).find("td:nth-child(3)").text().trim();
if (Date.parse(eventDate) > Date.parse(today)) {
//Do something...
}
</script>
I was thrilled to see how simple Date.parse was to use, then realized it only worked in Chrome (not in Firefox or IE). Any other ways to do this cross browser? Any thoughts would be appreciated. Thanks!
If you don't mind adding a library to your project; Moment.js provides a comprehensive set of formatting and query functions when handling dates not converted to the Date.parse input. It's fluent interface provides better readability for date comparison:
var dateFormat = "MM/DD/YY";
var today = moment().subtract(1, "day");
var eventDate = moment($(this).find("td:nth-child(3)").text().trim(), dateFormat);
if (moment(eventDate).isAfter(today)) {
// Do something
}
You can convert the date format like so:
'01/02/13'.replace(/^(\d{2})\/(\d{2})\/(\d{2})$/, '20$3-$1-$2')
// 2013-01-02
I have one text box. When I enter a date with the format MM/DD/YYYY in that textbox and click outside the textbox I need to display the result as MM/DD/YYYY+3 using JavaScript.
For example, if my date is 12/31/2013 then the result would be 01/03/2014.
Hope this link will help you to find the answer:
adding-number-of-days-to-an-entered-date-in-javascript.
Have a look at the excellent library moment.js with which you easily can add three days to your original date.
In your case it would be something like:
var input = moment(myTextBoxValue);
input.add('d', 3); // input is now 3 days later
I guess the easiest to program and best readable solution would be to use a dedicated library for handling dates, such as Moment.js.
There, you have got the add function which allows you to add an arbitrary amount of time to a given point in time. E.g.:
moment().add('days', 7);
If you use the moment function to parse the time entered, use that as your source value, call add on it, and return it as JavaScript Date using the toDate function, you get exactly what you want.
So basically it comes down to:
var sourceDate = moment(new Date(2013, 7, 8)),
targetDate = sourceDate.add('days', 3),
result = targetDate.toDate();
Then, result contains the Date object you wanted to have.
I'd prefer that over native JavaScript handling of Date, as it is way more readble and hence understandable.