Hide an element based on id value with jQuery - javascript

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();
}
});
});

Related

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());

JavaScript or Jquery - How to display last week of the month and next month's first Monday

How do you display only when it's the last week of the month (the text below).
The DATE that will be displayed here is next month's first Monday.
"Due on DD/MM/YY"
To detect if this is the last week in month you can follow this example:
https://www.javatpoint.com/calculate-current-week-number-in-javascript
To get next monday, you can call this function:
getNextMonday(){
var date = new Date();
date.setDate(date.getDate() + (1 + 7 - date.getDay()) % 7);
return date;
}
You can use the below JS Code. It will show the alert on last week of month means from last monday of month.
function Get_Last_Monday_of_Month()
{
var year = new Date().getFullYear();
var month = new Date().getMonth() + 1;
var dat = new Date(year+'/'+month+'/1');
var currentmonth = month;
var firstmonday = false;
while (currentmonth === month)
{
firstmonday = dat.getDay() === 1 || firstmonday;
dat.setDate(dat.getDate()+(firstmonday ? 7 : 1));
currentmonth = dat.getMonth()+1;
}
dat.setDate(dat.getDate()-7);
return dat;
}
function Get_Next_Coming_Monday()
{
var date = new Date();
date.setDate(date.getDate() + (1 + 7 - date.getDay()) % 7);
return date;
}
var d1 = new Date();
var d2 = Get_Last_Monday_of_Month();
var d3 = Get_Next_Coming_Monday();
if (d1.getTime() >= d2.getTime())
{
var datestring = ("0" + d3.getDate()).slice(-2) + "/" + ("0"+(d3.getMonth()+1)).slice(-2) + "/" + d3.getFullYear();
document.write ("Due on " + datestring);
}

How to insert space between two values while using protractor?

I am creating a script to enter date in some specific field, the format it requires is MMM DD, YYYY, as you can see format has 2 spaces one between month name and date and other between comma and year. I searched so many places and tried below code but it returns value as NaN, 2018 my code is listed below-
this.getCurrentDate = function () {
var d = new Date();
var currentDate = d.getDate();
var currentMonth = d.getMonth()+1;
var currentYear = d.getFullYear();
if (currentDate < 10){
currentDate = '0'+currentDate;
}
if (currentMonth < 10){
currentMonth = '0'+currentMonth;
}
var today = currentMonth + '\xa0' + currentDate-1 + ',' + '\xa0' + currentYear;
console.log(today);
return today;
};
Your issue lies with this line of code:
var today = currentMonth + '\xa0' + currentDate-1 + ',' + '\xa0' + currentYear;
So previously you set these two variables to strings:
if (currentDate < 10){
currentDate = '0'+currentDate;
}
if (currentMonth < 10){
currentMonth = '0'+currentMonth;
}
In the variable today at currentDate you're trying to subtract the integer 1 from a string. Hence, NaN (Not a Number).
You are subtracting 1 from a string which is causing error.
this.getCurrentDate = function () {
var d = new Date();
var currentDate = d.getDate();
var currentMonth = d.getMonth()+1;
var currentYear = d.getFullYear();
if (currentDate < 10){
currentDate = '0'+currentDate;
}
if (currentMonth < 10){
currentDate--; //Fixed here.
currentMonth = '0'+currentMonth;
} //removed -1 from current date
var today = currentMonth + '\xa0' + currentDate + ',' + '\xa0' + currentYear;
console.log(today);
return today;
};
You have to subtract value from a number before you change it to a string. This will work now.

Adding additional days but only on a Weekday (Mon-Fri) and skipping the weekend

How can the function below be modified such that if getdate('add',2) was called and that if the present date was to land on a Friday ie. (Feb. 23, 2015) the additional 2 "work week" dates would bring the new "work week" date to Feb. 27, 2015.
I need the function to basically skip the weekend. If the present date lands on Friday.
function getdate(type,y) {
if (type == 'add') {
var someDate = new Date();
var numberOfDaysToAdd = y
someDate.setDate(someDate.getDate() + numberOfDaysToAdd);
var dd = someDate.getDate();
var mm = someDate.getMonth() + 1;
var yyyy = someDate.getFullYear();
return dd + '/'+ mm + '/'+ yyyy
}
}
I use while to check if every next day is weekend day or not,if yes then skip it.
function getdate(type,y) {
if (type == 'add') {
var someDate = new Date();
var numberOfDaysToAdd = y;
var i=1;
while(i<=numberOfDaysToAdd){
someDate.setDate(someDate.getDate() + 1);
if(someDate.getDay() != 0 && someDate.getDay() != 6){//if the day isn't weekend days,then count it.
i++;
}
}
var dd = someDate.getDate();
var mm = someDate.getMonth() + 1;
var yyyy = someDate.getFullYear();
return dd + '/'+ mm + '/'+ yyyy
}
}
so this code you can skip all weekend days even if the added date is next 2 or more weeks.

Set new date 12 months after in a form

I am very new to script and checked many answers but could not find the complete answer.
In a form, I have a start date, number of months and end date - I want to display the end date when the start date is entered - I have created this script but I must be missing something.
Here's my code:
[script type="text/javascript" src=Datejs][/js]
[script type="text/javascript" ]
window.onload = function() {
var startdateEl = document.getElementById("customFields_cf_232");
var leasetermEl = document.getElementById("customFields_cf_34");
var enddateEl = document.getElementById("customFields_cf_38");
function CalculateDate {
var enddateEl=leasetermEl.months().startdateEl;
}
var enddateEl.onblur = CalculateDate;
};
[/script]
I made this. It listens to your keystrokes live. http://jsfiddle.net/4t54J/
<input name="startDate" type="text" value="MM-DD-YYYY" />
<input name="endDate" type="text" />
var SECOND = 1000;
var MINUTE = SECOND * 60;
var HOUR = MINUTE * 60;
var DAY = HOUR * 24;
var YEAR = DAY * 365.25;
var startDateInput = 'input[name="startDate"]';
var endDateInput = 'input[name="endDate"]';
$(startDateInput).live('keypress', function (e) {
var startDate = $(startDateInput).val();
var endDate = setEndDate(startDate);
$(endDateInput).val(endDate);
});
function setEndDate(startDate) {
var date = new Date();
var parts = startDate.split('-');
if (date != '' && parts.length > 2) {
// year, month (0-based), day
date.setFullYear(parts[2], parts[0] - 1, parts[1]);
date.setTime(date.getTime() + YEAR);
var mm = date.getMonth() + 1;
mm = (mm < 10 ? '0' : '') + mm.toString();
var dd = date.getDate();
var yyyy = date.getFullYear();
return mm + "-" + dd + "-" + yyyy;
} else {
return '';
}
}

Categories

Resources