i am making app in Django and i would like to launch function every time that i reload calendar. When user clicks arrows on the side of calendar it reloads division with calendar and shows new month. When user clicks on one of the days new content should show up (this is done by assigning content to each day using setAttribute("onclick", ...) function). Content showing works until i change month. From what i understand it is because i assign function to only existing DOM elements and not the new ones. I tried assigning it to new elements in various ways but it never worked. Is there some way to do it?
Month changing is done by ajax load function.
for (var x=0; x < days.length; x++) {
days[x].setAttribute("onclick", `setDay(
"${String(days[x].innerHTML)}",
"${(month[1].innerHTML)}"
)
`)}
$('#right').click(function () {
let mth = $('.month')[1].innerHTML.split(" ")
let month = parseInt(monthsObj[mth[0]])+1
let year = parseInt(mth[1])
if (month == 13) {
month = 1
year += 1
$('#newCal').html('').load(
"{% url 'calendarChange' monthNumber=4 yearNumber=2022 %}".replace("4", month).replace("2022", year)
);
} else {
$('#newCal').html('').load(
"{% url 'calendarChange' monthNumber=4 yearNumber=2022 %}".replace("4", month).replace("2022", year)
);
}
})
I tried putting that for cycle in function and putting it into ajax click. Ajax click then worked but for cycle didn't.
Related
I'm working on building a page to be a simple to look at page that tells the user if a shop is open or closed. I'm trying to have it display a green background and "yes, open" or a red background with "no, closed". The schedule varies every day of the week and some days the shop closes midday and reopens later. I'm having trouble getting the background and text to correctly change according to the time.
I tried implementing solutions from this user's similar problem, but I couldn't quite get them to work. I tried both the solution from 'Arnav Aggarwal' as well as the one below it from 'Darkisa'. Arnav's uses a flag set false and if statements.
When using the flag it seems to not care about the hours, only the day, put perhaps I am simply doing it wrong. Below is a code snippet, but I also have the code set up on codepen.io
let t = document.getElementById("Status");
t.innerHTML = "No";
document.body.style.backgroundColor = "red";
var q = new Date();
var hour = q.getHours();
var day = q.getDay();
function isBetween(testNumber, lowerLimit, upperLimit) {
return testNumber >= lowerLimit || testNumber <= upperLimit;
}
var flag = false;
if (day === 2 && (isBetween(hour, 0, 5) || isBetween(hour, 6, 7))) {
flag = true;
}
if (flag) {
let t = document.getElementById("Status");
t.innerHTML = "Yes";
document.body.style.backgroundColor = "green";
}
#status {width: 3em}
<div id="Status"></div>
For me, Arnav's code seems more my speed as it is clearer what is happening and I'm not super familiar with loops and arrays like Darkisa's reply.
I additionally tried making a series of if else statements, but they do not work unless the day is [6], or Saturday.
Code using Arnav's Flag solution
Code using stacked If Else
I have searched online to get my result but i wasn't able to come across any right solution.
I want my page to automatically show a popup everyday by 5:00PM without refreshing the page.
So, if i visit a page by 4:50Pm or anytime before 5:00PM, Once i am still on that page, it should auto pop up a div without refreshing the page.
I tried using this code but i have to refresh the page before it works which doesn't seem efficient.
$(document).ready(function() {
var currentTime = toUTC(new Date());
var startTime = toUTC(new Date());
var endTime = toUTC(new Date());
startTime.setHours(20);
startTime.setMinutes(10);
startTime.setSeconds(59);
endTime.setHours(20);
endTime.setMinutes(0);
endTime.setSeconds(0);
var currentTimez = (currentTime.getHours() + 1);
if (currentTimez == 20 && currentTime.getMinutes() == 20){
popup();
}
});
function popup() {
alert("Thanks")
}
function toUTC(inDate) {
inDate.setMinutes(inDate.getMinutes() + inDate.getTimezoneOffset());
return inDate;
}
I don't mind if i have to hit the db to get this done or using cookies.
you need to use a timer
var current = new Date();
var fivePM = new Date(current.getYear(), current.getMonth(), current.getDayOfMonth());
fivePM.setHour(17);
if (current < fivePM) {
var diff = fivePM.getTime() - current.getTime();
}
var timerID = setTimeout(popup, diff);
I have to hide one web part on page or whole page (whatever I find quicker) on every Friday. I made javascript code few months ago to hide web parts after 10AM, so I edited that code for new purpose.
window.addEventListener("load", function(){
var currentDay = new Date();
var day = currentDay.getDay();
var hideMe = document.getElementById("MSOZoneCell_WebPartWPQ3");
/* This is web part that I need to hide */
if(day=3) { /* I put 3 for today to check if it will work, but I need Friday as a day */
hideMe.style.display = "none";
}
else {
hideMe.style.display = "block";
}
}, false);
I put == instead of = inside If clause
if(day==3)
and now it works.
I've written a Javascript function that loads paginated content onto a page as you scroll to the bottom. The goal of this function is to increment the page number as you scroll and add that specific page number to the content already displayed, like Facebook does.
$(document).ready(function() {
$(window).scroll(function() {
var pagenumber = document.getElementById("pagenumber");
var results_box = document.getElementById("results_box");
var combo = pagenumber.innerHTML.split("|");
var pn = parseInt(combo[0]);
var last = parseInt(combo[1]);
results_box.innerHTML = "";
if ($(window).scrollTop() == $(document).height() - $(window).height()) {
// ajax call get data from server and append to the div
results_box.innerHTML = "Loading...";
if (last != 1) {
if (pn < last) {
request_page(pn + 1);
} else if (pn == last) {
pagenumber.innerHTML = pn + 1 + "|" + last;
request_page(last);
} else {
results_box.innerHTML = "No More Content available";
}
}
}
});
});
the ajax "loading..." code not fire but when it randomly does it might load just two pages or duplicate some. My conjecture is that is has to do with the lack of a timestamp on each request for a new page.
The request_page function is fired once before the page is loaded, to display the first page of code, and the pagination "next" button when clicked accurately adds new content to the page,so my question is, how would i incorporate a timestamp into this function to effectively load data onto a page?
For clarity there is a div that displays the page number you're on out of total pages ex. 1 | 3 , the "last" variable is the last page ( 3 ) and the "pn" page number variable is the current page (1)
I want to calculate the time between two clicks of an attribute with javascript but I don't know how.
For example;
click here
if the user clicks more than once -let's say in 5 seconds- I want to display an alert. I'm using jQuery if that helps. I don't know much about javascript but I've been coding a small project in my free time.
Something like this would do the trick. Keep a variable with the time of the last click and then compare it when the user clicks the link again. If the difference is < 5 seconds show the alert
<a id='testLink' href="#">click here</a>
<script type='text/javascript'>
var lastClick = 0;
$("#testLink").click(function() {
var d = new Date();
var t = d.getTime();
if(t - lastClick < 5000) {
alert("LESS THAN 5 SECONDS!!!");
}
lastClick = t;
});
</script>
The following may help you getting started:
var lastClicked = 0;
function onClickCheck() {
var timeNow = (new Date()).getTime();
if (timeNow > (lastClicked + 5000)) {
// Execute the link action
}
else {
alert('Please wait at least 5 seconds between clicks!');
}
lastClicked = timeNow;
}
HTML:
click here
Create a variable to hold the time of a click, say lastClick.
Set up a click handler for the element you want to track clicks on.
Inside the handler, check for a value in lastClick. If there is no value, set it to the current time. If there is a value, compare it against the current time. If the difference is within the range you're checking for, display the alert.
Start with
var lastClicked = (new Date()).getTime(); //not zero