I have countdown in my .container2
div but when I tried to reload that specific container its reload perfectly but my countdown didn’t showed up and also button got disabled..
<div id="container2">
<h4 id="title">Type Data here</h4>
<div class="controls">
<div class="main-controls">
<div class="dropdown">
<button
class="btn btn-primary dropdown-toggle"
data-bs-toggle="dropdown" id="btnCounter" disabled >
File <span id="count"></span>
</button>
<div class="dropdown-menu">
<button id="txt-btn" class="dropdown-item" onclick="refreshDiv();">
Save
</button>
</div>
</div>
var spn = document.getElementById("count");
var btn = document.getElementById("btnCounter");
var count = 3; // Set count
var timer = null; // For referencing the timer
(function countDown() {
// Display counter and start counting down
spn.textContent = count;
// Run the function again every second if the count is not zero
if (count !== 0) {
timer = setTimeout(countDown, 1000);
count--; // decrease the timer
} else {
// Enable the button
btn.removeAttribute("disabled");
}
}());
function refreshDiv() {
$('#container2').load(window.location.href + " #container2");
}
2
Answers
You call
countDown()
function only init time that’s the issue. on button click call againcountDown()
function !Try this code it’s help you
what are you trying to do? is it something like this?
when reload button is pressed, reload div also function inside div? so countdown function execute again?
hope this help, and give you clue.