I have an application in which I use a couple of date/time manipulation function to populate a couple of calendars. Basically, a user selects a month/year from a dropdown (say, March 2019) and I populate the calendars with 03/01/2019 and 03/31/2019.
I wanted to do this client side so tried to convert those function to javascript and I am getting strange results and can't see what I am doing wrong.
This is the original C# functions I defined and used:
public static DateTime FirstDayOfMonth(this DateTime dt)
{
return new DateTime(dt.Year, dt.Month, 1);
}
public static DateTime LastDayOfMonth(this DateTime dt)
{
DateTime dtFirstDayOfMonth = new DateTime(dt.Year, dt.Month, 1);
DateTime dtLastDayOfMonth = dtFirstDayOfMonth.AddMonths(1).AddDays(-1);
return dtLastDayOfMonth;
}
I called these like below:
DateTime dtSelected = DateTime.Today.AddMonths(int.Parse(ddlMonth.SelectedValue)).AddYears(-1);
dtStartDate = Utils.FirstDayOfMonth(dtSelected);
dtEndDate = Utils.LastDayOfMonth(dtSelected);
The dropdown list is populated like:
for (int i = 12; i >= 1; i--)
{
string s = DateTime.Now.AddYears(-1).AddMonths(i).ToString("Y");
ListItem li = new ListItem(s, i.ToString());
ddlMonth.Items.Add(li);
}
The dropdown entries would look like:
May, 2019 -- value of 12
April, 2019 -- value of 11
....
July, 2018 -- value of 2
June, 2018 -- value of 1
This is my attempt at translating to javacript:
function firstDayOfMonth(dt) {debugger
var year = dt.getFullYear();
var month = dt.getMonth();
var day = dt.getDate();
return new Date(year, month, 1);
}
function lastDayOfMonth(dt) {debugger
var year = dt.getFullYear();
var month = dt.getMonth();
var day = dt.getDate();
var firstDayOfMonth = new Date(year, month, 1);
var lastDayOfMonth = firstDayOfMonth.AddMonths(1).AddDays(-1); --> shows error when called; Object doesn't support property or method 'AddMonths'
return lastDayOfMonth;
}
$(document).on('change', '#ddlMonth', function () {debugger
var monthID = this.value;
var ddlMonth = $('#ddlMonth');
var today = new Date();
var startDate = new Date();
var endDate = new Date();
var dtSelected = new Date();
if (ddlMonth.val() == "")
{
....
}
else
{debugger
dtSelected.setMonth(dtSelected.getMonth() + ddlMonth.val() + 1); -- this becomes "Wed Oct 12, 2360" if I select "March, 2019" from dropdown!
dtSelected.setFullYear(dtSelected.getFullYear() - 1);
dtStartDate = firstDayOfMonth(dtSelected);
dtEndDate = lastDayOfMonth(dtSelected);
}
you have some problem in your code, this for example:
dtSelected.setMonth(dtSelected.getMonth() + ddlMonth.val() + 1); -- this becomes August of 2036!
you take today's month which is the 5 then add to itsome value from your slect and add 1 more and this is a lot of monthes to add.
I think you need to changesome things and do this like this: change the select values to be the date of the first day of each month and not just number:
for (int i = 12; i >= 1; i--)
{
DateTime date = DateTime.Now.AddYears(-1).AddMonths(i);
ListItem li = new ListItem(date.ToString("Y"), date.ToString("yyyy-MM-01"));
ddlMonth.Items.Add(li);
}
in this format you can use it on js with no problem.
now for your js function:
function lastDayOfMonth(dt) {debugger
var year = dt.getFullYear();
var month = dt.getMonth();
var day = dt.getDate();
var lastDayOfMonth = new Date(year, month, 1);
lastDayOfMonth.setMonth(lastDayOfMonth.getMonth() + 1);
lastDayOfMonth.setDate(lastDayOfMonth.getDate() - 1);
return lastDayOfMonth;
}
$(document).on('change', '#ddlMonth', function () {debugger
var ddlMonth = $('#ddlMonth');
dtStartDate = new Date(ddlMonth.val());
dtEndDate = lastDayOfMonth(dtStartDate);
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.