Full calendar: start calendar with a specific week - javascript

I'm using Full Calendar, I have a starting date and I need the calendar starts the week that corresponds to this date , I need to hide the previous weeks. here is a picture that explains my question.
in this example the starting date is April 20th.
$(".fc-day").each(function() {
var startDate = $('#start_date').val();
if (($(this).data('date')) < startDate){
$(this).parents().addClass('hidden');
}
});
I found a solution how to remove previous weeks, but I don't know how to replace them with future weeks.
This is the new script :
$(".fc-day").each(function() {
startDate = $('#start_date').val();
var date1 = new Date ($(this).data('date'));
var date2 = new Date (startDate);
var DD = date2.getDate();
var MM = date2.getMonth() + 1;
var YYYY = date2.getFullYear();
var startTraining = YYYY + '-'+ MM + '-'+ DD;
if ((date1 < date2) && (($(this).parent().get(0)) !== ($('.fc-day[data-date="' + startTraining + '"]').parent().get(0)))){
$(this).closest('.fc-row').addClass('hidden');
}
});

Fullcalendar automatically renders the week the date is in according to the firstDay property, so besides settings the correct day you also have to set the firstDay property to the correct day number by calling getDay().
element.fullCalendar({
defaultDate: startDate,
firstDay: startDate.getDay()
});

Related

JavaScript to change Year displayed based on month/day

I'm trying to create a script that if today's date is before January 16, the current year will print, but if today's date is greater than or equal to January 16, the following year will print.
I am pretty new to coding JavaScript so perhaps I am just missing something stupid. Can anyone help by looking over this code and tell me what I did wrong?
<script type="text/javascript">
var today = new Date();
var mm = today.getMonth()+1; //January is 0!
var dd = today.getday();
if (mm < 10) {
mm = '0'+mm
}
var today = new Date("mm/dd")
var other = new Date("01/16")
if (today < other){
var printDate = theDate.getFullYear();
}
else if (today >= other){
var printDate = theDate.getFullYear()+1;
}
</script>
Then in the HTML:
<strong>16 January</strong> <script>document.write(printDate);</script>
Output right now is "undefined." Any ideas would be greatly appreciated!
var today = new Date("mm/dd") // Invalid Date
var other = new Date("01/16") // Tue Jan 16 2001 00:00:00 GMT-0800 (PST)
this should start you on the right process - you need to compare each calendar item (first month, then day) to determine what you are looking for
all the variables you need:
var Today_day = (integer)
var Today_month = (integer)
var Compare_day = (integer) 16 // or 15? not sure about base 0 for a day
var Compare_month = (integer) 0
you know how to get Today_day and Today_month - so you should have everything you need
The simplified condition is: if month is not January (not 0), or date is after the 15th, then get next year:
var today = new Date, year = today.getFullYear();
if (today.getMonth() || today.getDate() > 15) year++;
console.log( year );
Or a bit shorter on one line:
var date = new Date, year = date.getFullYear() + (date.getMonth() || date.getDate() > 15)
console.log( year );

How can i convert seconds into date format in Javascript

The code is as below my Start_DateVal has the selected date and from the datepicker .And i am trying to alert the date which is 8 months ahead from the selected date (Start_DateVal).
function ChangeEndDate()
{
var Start_DateVal = document.getElementById("Start_Date").value;
if(Start_DateVal!='')
{
var arr=Start_DateVal.split("-");
var day= arr[0];
var month= arr[1];
var year= arr[2];
var d = new Date(year, month, day);
var InSeconds=d.setMonth(d.getMonth() + 8);
alert(InSeconds); //Here i wanted to display in date format instead of seconds.
}
}
Problem Statement: i am getting the alert in Seconds (InSeconds) Variable .But how do i convert Seconds into DD-MM-YYYY Date Format.Please Help me Thank you.
var d = new Date(2017, 01, 12);
var date = d.getDate();
var month = d.getMonth()+1;
var year = d.getFullYear();
if(date<10){
date='0'+date;
}
if(month<10){
month='0'+month;
}
alert(date + '-' + month + '-' + year)

Using Javascript to roll back a date in a specific format

I'm not sure how to do this part, or even how to pose it as a question. I've been working on a project for my job in which we have a start date and an end date that the user enters either through a datepicker, or typing it in, within certain formatting requirements which then sends a query to our database to request information. The start and end date are auto-populated when the page loads, with the start date going back 14 days to give the user an auto two weeks information unless they wanted to get more/less. Here's the problem:
1: Both input boxes (html of course) were working, up until we hit October because it's a 2 digit month.
2: The rollback date of -14 gives a negative number instead of rolling back the date to September XX.
I've tried var StartDay = StartDate.setDate(StartDate.getDate() - 14); and all that gives is the date and time which SQL does not recognize. So I'm trying to figure out how to either:
1: Get it to roll back to the correct date which I can then populate the box with, or
2: Re-format the datetime given to a format that will be yyyy-mm-dd
So far I've spent all day searching for an answer and I've found multiple that are close but not quite all that I'm looking for.
$(function () {
$("#StartDate").datepicker({ dateFormat: "yy-mm-dd", changeMonth: true });
$("#EndDate").datepicker({ dateFormat: "yy-mm-dd", changeMonth: true });
var StartDate = new Date();
var StartDay = StartDate.setDate(StartDate.getDate() - 14);
var StartMonth = StartDate.getMonth() + 1;
var StartYear = StartDate.getFullYear();
//if (StartMonth < 10) StartMonth = "0" + Month;
//if (StartDay < 10) StartDay = "0" + StartDay;
var StartDateBox = StartDate;
var EndDate = new Date();
var EndDay = EndDate.getDate();
var EndMonth = EndDate.getMonth() + 1;
var EndYear = EndDate.getFullYear();
//alert('the new date is ' + EndDay);
if (EndMonth < 10) EndMonth = "0" + Month;
if (EndDay < 10) EndDay = "0" + EndDay;
var EndDateBox = EndYear + "-" + EndMonth + "-" + EndDay;
$("#StartDate").attr("value", StartDateBox);
$("#EndDate").attr("value", EndDateBox);
});
Everything labled "End" works fine. It's the rollback of 14 days that I'm having the issue with. I have the "if" commented out because the number is a negative and therefore crashes the function.
*edit Awesome! Much appreciated, now that I see it, it makes more sense. However, it's set to August, so it's missing the +1 after .getMonth. I'll try to figure that out.
I would make a function for formatting your dates, to reuse that code.
function formatDate(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;
return year + "-" + month + "-" + day;
};
$(function () {
$("#StartDate").datepicker({ dateFormat: "yy-mm-dd", changeMonth: true });
$("#EndDate").datepicker({ dateFormat: "yy-mm-dd", changeMonth: true });
var StartDate = new Date();
StartDate.setDate(StartDate.getDate() - 14);
var StartDateBox = formatDate(StartDate);
var EndDate = new Date();
var EndDateBox = formatDate(EndDate);
$("#StartDate").attr("value", StartDateBox);
$("#EndDate").attr("value", EndDateBox);
});

Get First date and Last date of week after given a date in dd-mmm-yyyy format using jquery

I am giving Date in dd-MMM-yyyy format like 01-dec-2013 and i want start date and end date of the week.
After i change the given date by on button click like left and right arrow i want right start and end date of the week,
So please help me for this, using Jquery
Try
var date = new Date('03-dec-2013');
var day =date.getDay();
var start = new Date(date)
start.setDate(start.getDate() - day)
console.log(start)
var end = new Date(date)
end.setDate(end.getDate() - day + 6)
console.log(end)
Demo: Fiddle
Note: The parsing of the date string may not be supported in all environments, need to confirm that. For a safer parsing use a date library like momentjs
Try
fiddle Demo
$(function () {
$('#date').datepicker({
dateFormat: "dd-M-yy",
onSelect: function (dateText, inst) {
var date = $(this).datepicker('getDate');
startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
$('#startDate').text($.datepicker.formatDate(dateFormat, startDate, inst.settings));
$('#endDate').text($.datepicker.formatDate(dateFormat, endDate, inst.settings));
}
});
});
onSelect:
Take a look at Moment.js. It saves all such work by allowing to write code like:
moment(input).day(0); // Sunday of this week
moment(input).day(6); // Saturday of this week
moment(input).day(-7); // last Sunday (0 - 7)
moment(input).day(7); // next Sunday (0 + 7)
moment(input).day(10); // next Wednesday (3 + 7)
moment(input).day(24); // 3 Wednesdays from now (3 + 7 + 7 + 7)
And it can parse various formats of date strings.
JS
$(function() {
$('#anydate').datepicker({
showWeek:true,
firstDay:0,
dateFormat: 'dd-M-yy',
onSelect: function() {
var d = $(this).datepicker('getDate');
var tstamp = $.datepicker.formatDate('#',d);
var wd = d.getDay();
var wkstart = new Date();
wkstart.setDate(d.getDate() - wd);
var wkend = new Date();
wkend.setDate(d.getDate() + (7 - wd));
$('#weekstart').val(wkstart.toDateString());
$('#weekend').val(wkend.toDateString());
}
});
});
HTML
<input type="text" class="datepicker" name="anydate" id="anydate" />
<input type="text" id="weekstart" />
<input type="text" id="weekend" />
Working jsFiddle Demo

how to increment date by giving the number of days in javascript

I want to increment dates using JavaScript I used .setDate(1) to increment dates by one day
but if the date is 31/11/2011 after increment becomes 1/0/2012,
the question is how to increment date by giving the number of days .
js
newDate.setDate(newDate.getDate()+1);
alert(newDate.getFullYear()+"-"+newDate.getMonth()+"-"+newDate.getDate());
That is correct, because in javascript, months are indexed from 0, not 1.
You need to alert like this instead:
alert(newDate.getFullYear()+"-"+(newDate.getMonth()+1)+"-"+newDate.getDate());
That is not wrong, given that months in Javascript dates range from 0 to 11. So when you speak of 31/11/2011, what javascript understands is 31/12/2011.
Lets make it some more clear:
var Date = new Date();
var DaysToAdd = 6;
someDate.setDate(Date.getDate() + DaysToAdd);
Formatting Date to dd/mm/yyyy format:
var dd = Date.getDate();
var mm = Date.getMonth() + 1;
var yyyy = Date.getFullYear();
var NewDate = dd + '/'+ mm + '/'+ yyyy;
Hope this helps.
You can use like this, Suppose you want to increment current date by 2 days then,
var today = new Date(); // Or Date.today()
var newDate = today.add(2).day();

Categories

Resources