Develop Reference

Display the current date in a text box after clicking a checkbox

I'm building a form to standardize filenames (I'm a video editor). After a lot of research, copying, pasting and testing I'm almost there. I just need to display the current date at the end of the filename after the user clicks on the corresponding checkbox.
The HTML has the code to get the current date and to format it as I want (YYMMDD), but for the life of me I can't find a way to display it at the end of the filename. The code to display the date works because I can enable/disable text, but I can't display the result of the todaysdate function.
This is the code to get the current date and format it to YYMMDD:
function SetDate()
{
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear() - 2000;
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + month + day;
document.getElementById('today').value = today;
}
This is the code that adds or removes the date at the end of the filename when you click the checkbox.
function todaysdate()
{
var checkbox = document.getElementById('todayis');
if (checkbox.checked != false)
document.getElementById('todayis').value = "DATE";
if (checkbox.checked != true)
document.getElementById('todayis').value = "";
}
This is the code for the checkbox:
Add date (YYMMDD): <input type="checkbox" onclick="todaysdate()" id="todayis" value="" />
Thanks in advance for your help.
Edit: Added the code.

In your todaysdate function you set the value of the todayis input to DATE, where you should be setting it to the value of your date calculation. Here’s just a little change to what you have that should probably work!
function todaysdate()
{
var checkbox = document.getElementById('todayis');
if (checkbox.checked != false)
document.getElementById('todayis').value = getDate();
else if (checkbox.checked != true)
document.getElementById('todayis').value = "";
}
function getDate()
{
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear() - 2000;
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "" + month + "" + day;
return today;
}

You can also use the php function Time:
Set the timezone:
date_default_timezone_set('America/New_York');
And get the actual date:
$date_now = date('Y/m/d', time());
So, to set the value on the input:
<input type="checkbox" value="<?php echo $date_now ?>" />

function getYYMMDDDate(date) {
var year = String(date.getFullYear()).substring(2,4);
var month = String(date.getMonth() + 1).padStart(2, "0");
var day = String(date.getDate()).padStart(2,"0");
return year + month + day;
}
...
// change this document.getElementById('todayis').value = "DATE";
document.getElementById('todayis').value = getYYMMDDDate(new Date());

Calculating weekends within a month

I want to build a simple function that would receive a particular month to check. In return it would provide the amount of weekend days it counted within that month.
In the code I'm assuming that the current year is the relevant year to simplify the task.
The problem is it's not return the proper answer for weekends in reality when going over a calendar and counting it manually.
workDays(4); // submitting the month to check for
function workDays(monthCheck) //Calculate the actual work days: eliminate weekends from month
{
// init month to check as proper date variable and setting days to 0 for total days
var month = new Date(new Date().getFullYear(), monthCheck+1, 0);
var daysOff = 0; //init
for(i = month.getDate(); i>=0; i--) //check for days that = 0 or 6 (Sunday OR Saturday)
{
if(new Date(month.getFullYear(), monthCheck, i).getDay() == 0 || new Date(month.getFullYear(), monthCheck, i).getDay() == 6)
{
console.log(daysOff++); // weekend day added to weekend days counter
}
}
return console.log("The days off for the month of " + (month.getMonth()) + " are " + daysOff + " days off.");
}

I find your logic very confusing. I refactored the code to an (imo) more readable version, and the result seems as expected:
nonWorkDays(4);
function nonWorkDays(month)
{
var current = new Date(new Date().getFullYear(), month - 1, 1);
var daysOff = 0; //init
// as long as our date is in the requested month
while (current.getMonth() == month -1) {
// saturday or sunday?
if (current.getDay() == 0 || current.getDay() == 6) {
daysOff++;
console.log(daysOff, current);
}
// move to next day
current.setDate(current.getDate() + 1);
}
console.log("The days off for the month of " + month + " are " + daysOff + " days off.");
return daysOff;
}
And a fiddle to demonstrate: https://jsfiddle.net/4kmtemfy/

Not sure where you went wrong but this seems right:
var d = new Date();
var getTot = daysInMonth(d.getMonth(),d.getFullYear());
var weekends = new Array();
for(var i=1;i<=getTot;i++){
var newDate = new Date(d.getFullYear(),d.getMonth(),i)
if(newDate.getDay()==0 || newDate.getDay()==6){
weekends.push(i)
}
}
console.log(weekends.length);
function daysInMonth(month,year) {
return new Date(year, month, 0).getDate();
}

Your issue is with monthCheck+1. Since months are zero indexed and you want the month number of the following month, don't subtract 1. You can also simplify the logic somewhat:
function workDays(monthCheck) {
// Create date for last day of month to check
var month = new Date(new Date().getFullYear(), monthCheck, 0);
var daysOff = 0;
// For each day of the month
for(var i = month.getDate(); i>=0; i--) {
// Add day off for Saturday and Sunday
if (!(month.getDay()%6)) {
daysOff++;
}
month.setDate(month.getDate()-1);
}
return daysOff;
}
var month = 4;
console.log('Days off for ' + month + ' are ' + workDays(month) + '.');

Hide an element based on id value with jQuery

I have a list of events and I'm setting the id of each event as an expiration date so when the date is less than the current date the element will be hidden. You can see my code below, It looks like I'm losing the value of my dateContent variable that's defined outside of my each function:
html:
<div class="today"></div>
<ul id="20160430" class="nostylelist event-list">
<li>Event 1</li>
<li>April 29, 2016</li>
<li>Minneapolis Convention Center</li>
<li>Minneapolis, MN</li>
<li>Booth 659</li>
</ul>
<ul id="20151106" class="nostylelist event-list">
<li>Event 2</li>
<li>November 4-5, 2015</li>
<li>Minneapolis Convention Center</li>
<li>Minneapolis, MN</li>
<li>Booth 659</li>
</ul>
$(function() {
var today
var year
var month
var monthLength
var day
var dateContent
function currentDate() {
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth()+1;
var monthLength = month.toString().length;
var day = today.getDate();
if (monthLength == 1) {
dateContent = $('.today').append(year).append('0' + month).append(day);
} else {
dateContent = $('.today').append(year).append(month).append(day);
}
}
currentDate();
$('.event-list').each(function( index ) {
if ($(this).attr('id') < dateContent) {
$(this).hide();
}
//$('.id').text(dateContent);
});
});

Replace the currentDate function by this to get the dateContent as a string in the expected format. Note that getFullYear, getMonth and getDate return numbers so we should not add them directly if we want to preserve our format.
function currentDate() {
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth()+1;
var monthLength = month.toString().length;
var day = today.getDate();
if (monthLength == 1) {
dateContent = "" + year + "0" + month + day;
} else {
dateContent = "" + year + month + day;
}
}

I think you are expecting dateContent to hold the current date. However, what you are doing is setting the current date, example, 20160410 to .today and the return value of the appending is a DOM element, not the value 20160410.
So even the comparison with attr('id') will not work.

<script>
$(function () {
var today
var year
var month
var monthLength
var day
var dateContent
function currentDate() {
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth() + 1;
var monthLength = month.toString().length;
var day = today.getDate();
if (monthLength == 1) {
$('.today').append(year).append('0' + month).append(day);
dateContent = year + '0' + month + day;
} else {
$('.today').append(year).append(month).append(day);
dateContent = year + month + day;
}
}
currentDate();
$('.event-list').each(function (index) {
console.log(dateContent);
console.log($(this).attr('id'));
if ($(this).attr('id') < dateContent) {
$(this).hide();
}
});
});

How to get first week number of the month - javascript

I am populating all the months in Dropdown list, and i am enabling up to current month and remain months will be disabled, like
var date = new Date();
var month = new Date().getMonth() + 1;
var weeknum=//getting week number of the month
var options = $('#ddlMonth option');
var values = $.map(options, function (option) {
return option.value;
});
for (var i = 0; i <= values.length; i++) {
if (i > month) {
$("#ddlMonth option[value=" + i + "]").attr('disabled', true);
}
}
$('#ddlMonth').val(month);
Now I want to disable month if current week of the current month is first week.

Date.prototype.getMonthWeek = function(){
var firstDay = new Date(this.getFullYear(), this.getMonth(), 1).getDay();
return Math.ceil((this.getDate() + firstDay)/7);
}
Demo
http://jsfiddle.net/ay10bmpm/
　
Ref
http://www.somethinghitme.com/2010/04/14/how-to-get-the-week-in-a-month-for-a-date-with-javascript/

function(){
var d = new Date();
d.setHours(0,0,0);
d.setDate(d.getDate()+4-(d.getDay()||7));
return Math.ceil((((d-new Date(d.getFullYear(),0,1))/8.64e7)+1)/7);
};
This will get you the week in year and from this is simple math. (maybe not so simple for 5 weeks per month).
Or you can get the number of the week function from this fiddle : http://jsfiddle.net/OlsonDev/5mXF6/1/ (works with 5 weeks, tested)

Increase or decrease value using jquery

I have a javascript variable which is the day number of current date.
I wanted to give the user to go to previous date by clicking on a button.
Here's the fiddle.
Tried googling but I didn't understand or anything did help me.
I'm able to decrease just one day by giving -1 in the day variable. But I couldn't figure out how to decrease it on each click.
Someone help me in how can I decrease and increase the date of click of those buttons?
Thanks in advance.

There are a couple of problems in your code. The major one being that you create a new date Object on every button click with the current date. That's why you're getting the same result every time.
If you just want to add or remove one day from the date you could do just this:
var currentDate = new Date();
$('button').click(function() {
var add = $(this).hasClass('increase_date') ? 1 : -1;
currentDate.setDate(currentDate.getDate()+add);
$('.display_date').html(currentDate);
})
http://jsfiddle.net/3VQZy/

Store your current date in a global variable & use -= operator on it do decrese it by one using current value.
Something like this http://jsfiddle.net/SYRDR/2/
I only show how to decrease it, you have to add further conditions to formatt date properly

demo: http://jsfiddle.net/SYRDR/14/
$(document).ready(function() {
showDate(0);
$('.decrease_date').click(function() {
showDate(-1);
});
$('.increase_date').click(function() {
showDate(1);
});
})
function showDate(change)
{
var current_date;
if(change == 0)
{
current_date = new Date();
}
else
{
current_date = new Date($('.display_date').html());
}
var year = current_date.getFullYear();
var month = "0" + (current_date.getMonth() + 1);
var day = current_date.getDate();
if(change == -1)
{
day = day - 1;
}
if(change == 1)
{
day = day + 1;
}
var start_date2 = year + "-" + month + "-" + day;
$('.display_date').html(start_date2);
}