With below code I'm trying to write the code to display recent (from date of b'day to 15 days) b'day wishes. At present nothing is displayed. I'm new to JavaScript, so need your help.
var dates = ["02/09/2009", "12/10/2010", "02/01/2001"];
var names = ["Mac", "Jac", "Tom"];
var today = new Date();
alert(today.getMonth()+1);
//alert(today.getDay());
//alert(typeof(day));
for(var i = 0; i < dates.length; i++) {
if (dates[i].split('/')[0] = today.getDay() && dates[i].split('/')[1] = today.getMonth()+1 && dates[i].split('/')[0] <= today.getDay()+15)
{
document.getElementById("demo").innerHTML = "Wish You Happy Birthday, " + names[dates.indexOf(dates[i])] + "(" + dates[i] + ")";
}
else{
document.getElementById("demo").innerHTML = "No matches";
}
}
<p id="demo"></p>
At last, with 3rd approach I could make it work, that you all for your help!
function parseDate(str) {
var mdy = str.split('/');
return new Date(mdy[2], mdy[0]-1, mdy[1]);
}
// Take the difference between the dates and divide by milliseconds per day.
// Round to nearest whole number to deal with DST.
function datediff(first, second) {
return Math.round((second-first)/(1000*60*60*24));
}
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var y = today.getFullYear();
var dates = ["10/16/" + y, "09/20/" + y, "10/2/" + y, "9/6/" + y, "10/10/" + y, "10/3/" + y];
var names = ["Mac", "Jac", "Tom", "Abhay", "Mahesh", "Jayesh"];
var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
for(var i = 0; i < dates.length; i++) {
//document.getElementById("mySup").innerHTML = getGetOrdinal(dates[i].split('/')[0]);
if (datediff(parseDate(dates[i]), (today)) <= 7 && datediff(parseDate(dates[i]), (today)) >= 1)
{
document.getElementById("demo").innerHTML = document.getElementById("demo").innerHTML + "Wish You Happy Birthday, " + names[dates.indexOf(dates[i])] + "!!! (" + getGetOrdinal(dates[i].split('/')[1]) + " " + months[dates[0].split('/')[0]-1]+ ")" + "<br>";
}
}
function getGetOrdinal(n) {
var s=["th","st","nd","rd"],
v=n%100;
return n+(s[(v-20)%10]||s[v]||s[0]);
}
<p><span id="demo"></span><sup id="mySup"></sup><p>
The below answer is what I had to do finally which involves functions, methods, etc. I'm sure it might be helpful to someone.
function parseDate(str) {
var mdy = str.split('/');
return new Date(mdy[2], mdy[0]-1, mdy[1]);
}
// Take the difference between the dates and divide by milliseconds per day.
// Round to nearest whole number to deal with DST.
function datediff(first, second) {
return Math.round((second-first)/(1000*60*60*24));
}
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var y = today.getFullYear();
var dates = ["10/1/" + y, "09/20/" + y, "10/2/" + y, "9/6/" + y, "10/10/" + y, "10/1/" + y];
var names = ["Mac", "Jac", "Tom", "Abhay", "Mahesh", "Jayesh"];
var joingDates = ["10/16/" + y, "09/20/" + y, "10/2/" + y, "9/6/" + y, "10/10/" + y, "10/3/" + y];
var joiningyears = ["2000","2002","2010","2011","2011","2014"];
var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
for(var i = 0; i < dates.length; i++) {
//document.getElementById("mySup").innerHTML = getGetOrdinal(dates[i].split('/')[0]);
if (datediff(parseDate(dates[i]), (today)) <= 7 && datediff(parseDate(dates[i]), (today)) >= 1)
{
document.getElementById("demo").innerHTML = document.getElementById("demo").innerHTML +
"<li>" +
"Wishing a very" + " Happy Birthday to ".bold().fontcolor("blue") +
names[i].bold().fontcolor("Red") +
"!!! (" +
getGetOrdinal(dates[i].split('/')[1]).split('')[0] +
getGetOrdinal(dates[i].split('/')[1]).split('')[1].sup() +
getGetOrdinal(dates[i].split('/')[1]).split('')[2].sup() +
" " +
months[dates[0].split('/')[0]-1] +
")" +
"<br>";
}
}
for(var i = 0; i < joingDates.length; i++) {
if (datediff(parseDate(joingDates[i]), (today)) <= 7 && datediff(parseDate(joingDates[i]), (today)) >= 1)
{
document.getElementById("demo").innerHTML = document.getElementById("demo").innerHTML +
"<li>" +
"Wishing a very " +
"Happy ".bold().fontcolor("blue") +
getGetOrdinal(y-joiningyears[i]).split('')[0].bold().fontcolor("blue") +
getGetOrdinal(y-joiningyears[i]).split('')[1].sup().bold().fontcolor("blue") +
getGetOrdinal(y-joiningyears[i]).split('')[2].sup().bold().fontcolor("blue") +
" Work Anniversary to ".bold().fontcolor("blue") +
names[i].bold().fontcolor("Red") +
" with " +
"XYZ Company".fontcolor("green").bold() +
"!!! (" +
getGetOrdinal(joingDates[i].split('/')[1]).split('')[0] +
getGetOrdinal(joingDates[i].split('/')[1]).split('')[1].sup() +
getGetOrdinal(joingDates[i].split('/')[1]).split('')[2].sup() +
" " +
months[joingDates[0].split('/')[0]-1] +
")" +
"<br>";
}
}
function getGetOrdinal(n) {
var s=["th","st","nd","rd"],
v=n%100;
return n+(s[(v-20)%10]||s[v]||s[0]);
}
<p id="demo"><p>
I want to create dynamic table column in same row in a datatable using loop. But I can't do this. Please help..
This is my code..
for (var count=1;count<=sessionStorage.getItem('differ');count++)
{
var j=count;
$.ajax({
url:serverURL2+'get_list_of_cme_application_by_cme_id/'+ac_id,
dataType: 'json',
type: 'get',
success: function(data){
if(data.error){
alert("Record not found!");
}else{
table=$("#example4").DataTable();
table.rows().remove().draw();
$.map(data.application_list,function(item){
var d = item.created_by_date_time;
d = d.split(' ')[0];
var date = new Date(d),
yr = date.getFullYear(),
month = date.getMonth() < 10 ? '0' + date.getMonth() : date.getMonth(),
day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(),
newDate = day + '-' + month + '-' + yr;
var sdd=new Date(item.start_date);
yr1 = sdd.getFullYear(),
month1 = sdd.getMonth() < 10 ? '0' + sdd.getMonth() : sdd.getMonth(),
day1 = sdd.getDate() < 10 ? '0' + sdd.getDate() : sdd.getDate(),
sd = day1 + '-' + month1 + '-' + yr1;
var edd=new Date(item.end_date);
yr2 = edd.getFullYear(),
month2 = edd.getMonth() < 10 ? '0' + edd.getMonth() : edd.getMonth(),
day2 = edd.getDate() < 10 ? '0' + edd.getDate() : edd.getDate(),
ed = day2 + '-' + month2 + '-' + yr2;
if(item.is_going==1)
{
if(k==0)
{
var start = new Date(item.start_date);
var end = new Date(item.end_date);
var diff = new Date(end - start);
var days = diff/1000/60/60/24;
$(".modal-body #ate").append('<div class="form-group row" style="padding-left:17%;margin-bottom: 0px;height: 30px;"><label class="form-control-label"for="l0"><h5>CME Name:</h5></label><label class="form-control-label"for="l0"><h5>'+item.cme_name+'</h5></label><label class="form-control-label"for="l0" style="padding-left:10%"><h5>CME Code:</h5></label><label class="form-control-label"for="l0"><h5>'+item.cme_code+'</h5></label></div><div class="form-group row" style="padding-left:30%;height: 20px;"><label class="form-control-label" for="l0"><h5>From</h5> </label><label class="form-control-label"for="l0"><h5>'+sd+'</h5></label><label class="form-control-label" for="l0"><h5>To</h5></label><label class="form-control-label"for="l0"><h5>'+ed+'</h5></label></div>');
k++;
}
table.row.add([item.council_code+item.application_year+item.application_number,newDate ,item.user_name,item.mobile_no,'<select class="form-control" id="present'+j+'><option value="0">Ab</option><option value="1">P</option></select>']).draw();
}
});
}
},
complete: function(){
}
});
}
In this above code using for loop I want to add different select box with different id value in different column but in same row.
Here is the Solution :
$("#myTable tr").each(function(index){
$(this).append("<td>test</td>");
});
Can this code be simplified? I am pretty sure it can be achieved by abstracting the variable and using an if else or a switch, each case would be the element ID...I'm having a a difficult time working through this.
function NoTime() {
if (shortTime == "") {
timeFormat = "N/A"
}
}
var shortTime;
var day;
var month;
var year;
var revisionDate = document.getElementById("RevisionDate").value;
shortTime = revisionDate;
day = revisionDate.substring(8, 10);
month = revisionDate.substring(4, 7);
year = revisionDate.substring(11, 15);
var timeFormat = day + " " + month + " " + year;
NoTime();
$("#RevisionDate")
.replaceWith("<div id='RevisionDate' class='col-md-12 margin-bottom-10px pad-L-15px border-1px width-174px pad-LR-3px width-227px' /></div>");
$("#RevisionDate").html(timeFormat);
var supplierPartInformationEffectiveDate = document.getElementById("SupplierPartInformationEffectiveDate")
.value;
shortTime = supplierPartInformationEffectiveDate;
day = supplierPartInformationEffectiveDate.substring(8, 10);
month = supplierPartInformationEffectiveDate.substring(4, 7);
year = supplierPartInformationEffectiveDate.substring(11, 15);
var timeFormat = day + " " + month + " " + year;
NoTime();
$("#SupplierPartInformationEffectiveDate")
.replaceWith("<div id='SupplierPartInformationEffectiveDate' class='col-md-12 margin-bottom-10px pad-LR-3px border-1px pad-LR-3px width-342px' /></div>");
$("#SupplierPartInformationEffectiveDate").html(timeFormat);
var SupplierPartInformationExpirationDate = document.getElementById("SupplierPartInformationExpirationDate")
.value;
shortTime = SupplierPartInformationExpirationDate;
day = SupplierPartInformationExpirationDate.substring(8, 10);
month = SupplierPartInformationExpirationDate.substring(4, 7);
year = SupplierPartInformationExpirationDate.substring(11, 15);
var timeFormat = day + " " + month + " " + year;
NoTime();
$("#SupplierPartInformationExpirationDate")
.replaceWith("<div id='SupplierPartInformationExpirationDate' class='col-md-12 margin-bottom-10px pad-LR-3px border-1px pad-LR-3px width-342px' /></div>");
$("#SupplierPartInformationExpirationDate").html(timeFormat);
var idArray = [ RevisionDate, SupplierPartInformationEffectiveDate, SupplierPartInformationExpirationDate ];
var attrIDArray = ["RevisionDate", "SupplierPartInformationEffectiveDate", "SupplierPartInformationExpirationDate"];
var stringIDArray = ["#RevisionDate", "#SupplierPartInformationEffectiveDate", "#SupplierPartInformationExpirationDate"];
for (i = 0; i < idArray.length; i++) {
var value = document.getElementById(attrIDArray[i]).value;
var day = value.substring(8, 10);
var month = value.substring(4, 7);
var year = value.substring(11, 15);
var timeFormat = day + " " + month + " " + year;
if (value == "") {
timeFormat = "N/A";
}
$(stringIDArray[i]).replaceWith("<div id='" + attrIDArray[i] + "' class='col-md-12 margin-bottom-10px pad-L-15px border-1px pad-LR-3px pad-TB-2px darkgrey-border-1px' /></div>");
if (stringIDArray[i] === "#RevisionDate") {
$("#RevisionDate").css("width", "227px");
} else {
$("#SupplierPartInformationEffectiveDate").css("width", "342px");
$("#SupplierPartInformationExpirationDate").css("width", "342px");
}
$(stringIDArray[i]).html(timeFormat);
}
I have a script which lists Google Calendar events with the start time, name and description but I would like to have the end time too so it reads;
5:00pm - 6:00pm - Event title - event description
Rather than just what it has at the moment which is just the start time and not the end time.
This is the script I have:
$(document).ready(GCalEvents());
function GCalEvents() {
var datenow = new Date();
var curyear = datenow.getFullYear();
var curmonth = datenow.getMonth() + 1;
var curdate = datenow.getDate();
var curhour = datenow.getHours();
var curmin = datenow.getMinutes();
var curtz = datenow.getTimezoneOffset();
//curtz = -480;
var plusmin = "-";
if (curtz <= 0) {
plusmin = "%2B";
}
curtz = Math.abs(curtz);
var curtzmin = curtz % 60;
curtz = parseInt(curtz / 60);
if (curtzmin < 10) { curtzmin = "0" + curtzmin; }
if (curtz < 10) { curtz = "0" + curtz; }
datenow = curyear + "-" + curmonth + "-" + curdate + "T" + curhour + "%3A" + curmin + "%3A00" + plusmin + curtz + "%3A" + curtzmin;
var url = "https://www.googleapis.com/calendar/v3/calendars/{calendarid}/events?alwaysIncludeEmail=false&maxResults=2&orderBy=startTime&showDeleted=false&showHiddenInvitations=false&singleEvents=true&timeMin=" + datenow + "&fields=items(start%2Csummary%2Cdescription)%2CtimeZone&key={key}";
// var url = "https://www.googleapis.com/calendar/v3/calendars/{calendarid}/events?alwaysIncludeEmail=false&maxResults=2&orderBy=startTime&showDeleted=false&showHiddenInvitations=false&singleEvents=true&timeMin=" + datenow + "&fields=items(start%2Csummary%2Cdescription)%2CtimeZone&key={key}";
$.getJSON(url, function(data) {
var event_start_date_new = new Date();
event_start_date_new.setDate(event_start_date_new.getDate() - 1);
for(i in data['items']) {
item = data['items'][i];
// event title
var event_title = item.summary;
var event_description = item.description;
// event start date/time
var event_start_date = new Date(item.start.dateTime);
// format the date and time
var month = event_start_date.getMonth();
var day = event_start_date.getDay();
var date = event_start_date.getDate();
var daysArr = new Array();
daysArr[0] = "Sunday";
daysArr[1] = "Monday";
daysArr[2] = "Tuesday";
daysArr[3] = "Wednesday";
daysArr[4] = "Thursday";
daysArr[5] = "Friday";
daysArr[6] = "Saturday";
var monthsArr = new Array();
monthsArr[0] = "January";
monthsArr[1] = "February";
monthsArr[2] = "March";
monthsArr[3] = "April";
monthsArr[4] = "May";
monthsArr[5] = "June";
monthsArr[6] = "July";
monthsArr[7] = "August";
monthsArr[8] = "September";
monthsArr[9] = "October";
monthsArr[10] = "November";
monthsArr[11] = "December";
var hour = event_start_date.getHours();
var min = event_start_date.getMinutes();
if (min < 10) { min = "0" + min; }
if (hour < 11) {
var ampm = "am";
if (hour == 0) { hour = 12; }
} else {
var ampm = "pm";
if (hour > 12) { hour = hour - 12; }
}
if (hour < 10) { hour = " " + hour; }
var event_start_str = daysArr[day] + ", " + monthsArr[month] + " " + date;
var event_time_str = hour + ":" + min + " " + ampm;
if (event_start_date.getDate() != event_start_date_new.getDate()) {
event_start_str = "<div class=\"calendar_date\"><strong>" + event_start_str + "</strong></div>";
event_start_date_new = event_start_date;
} else {
event_start_str = "";
};
// Render the event
$("#gcal-events").last().before("<div class=\"calendar_item\"><li>" + event_time_str + " - " + event_title + "<p><small>" + event_description + "</small></p></ul>" + "</li></div>");
}
});
};
If anyone is able to help with that to reversion the current script, that would be great.
The Events resource returns start and end dates as well (JSON format that has date, dateTime, timeZone attributes).
Based on your code, you're not using the end attribute which is why you're not having any values for the end date displayed. Your code for the start date is alright, so you can just re-implement it for the end attribute.
Hope this helps!
We have a problem with different browsers.
In Chrome everything works fine, but in firefox the code doesnt work.
Its this code:
currentTime = new Date();
var jaar = currentTime.getFullYear();
var maand = ('0' + (currentTime.getMonth() + 1)).slice(-2);
var dag = currentTime.getDay();
var uur = currentTime.getHours();
var minuut = currentTime.getMinutes();
var seconden = currentTime.getSeconds();
var huidigetijd = (jaar + '-' + maand + '-' + dag + ' ' + uur + ':' + minuut + ':' + seconden);
var gpsdatum = tijd;
var gpstime = new Date();
var gpsjaar = new Date(gpsdatum).getFullYear();
var gpsmaand = ('0' + (gpstime.getMonth() + 1)).slice(-2);
var gpsdag = new Date(gpsdatum).getDay();
var gpsuur = new Date(gpsdatum).getHours() + 1;
var gpsminuut = new Date(gpsdatum).getMinutes();
var gpsseconden = new Date(gpsdatum).getSeconds();
var gps = (gpsjaar + '-' + gpsmaand + '-' + gpsdag + ' ' + gpsuur + ':' + gpsminuut + ':' + gpsseconden);
if (gps >= huidigetijd){
var marker = new google.maps.Marker({
map : map,
position : point,
icon : chasericoon,
html : html
}); // einde var marker
markersArray.push(marker);
bindInfoWindow(marker, map, infoWindow, html);
};//einde gps timeout
I've tried something with " and ' but that doesnt make any sense.
Can someone help me with this ?
Thank you!
getDay() returns the day of the week (0 = Sunday, 1 = Monday...)
You want getDate() instead, and you will need to use the "0"+....slice(-2) trick to ensure it is zero-padded too. And the same padding trick on the hours, minutes and seconds too.