JavaScript related questions should go here.
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Mon May 30, 2011 9:44 am
When I put the script in a while loop it only works on the top one, the first row that comes out of the database. Does anyone knows a solution?
while($actie = mysql_fetch_assoc($sql_actielist)){
?>
<script type="text/javascript">
window.onload=WindowLoad;
function WindowLoad(event){
ActivateCountDown("tijd", <?php echo $actie['time'] - time(); ?>);
}
</script>
<?php
echo "<tr>
<td>".$actie['naam']."</td>
<td><span id='tijd'></span></td>
</tr>";
}
Thanks
Sevvlor
Josh
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Mon May 30, 2011 10:12 am
You can't define a function more than once with the same name.
You should have the loop inside the function block to generate the code to add all of the countdowns.
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Mon May 30, 2011 11:56 am
I don't get it, doest that mean that I have to put the php while loop into the javascript box?
like this
<script type="text/javascript">
window.onload=WindowLoad;
function WindowLoad(event){
<?php
while($actie = mysql_fetch_assoc($sql_actielist)){
?>
ActivateCountDown("tijd", <?php echo $actie['time'] - time(); ?>);
<?php
echo"
<td>".$actie['naam']."</td>
<td><span id='tijd'></span></td>
";
}
?>
}
</script>
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Mon May 30, 2011 12:39 pm
sevvlor wrote: I don't get it, doest that mean that I have to put the php while loop into the javascript box?
Yes.
Except you can't have that html there.
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Mon May 30, 2011 6:58 pm
oke, that worked only the bottom one counts down.
echo '
<script type="text/javascript">
window.onload=WindowLoad;
function WindowLoad(event){';
while($actie= mysql_fetch_assoc($sql_actielist)){
$time = $actie['time'] - time();
$tt++;
echo 'ActivateCountDown("tijd'.$tt.'", '.$time.' );';
}
echo '
}
</script>';
$sql_actielist = mysql_query("SELECT * FROM actie WHERE acnaam = '".$naam."'") or die(mysql_error());
while($actie= mysql_fetch_assoc($sql_actielist)){
$dt++;
echo "
<tr>
<td>".$actie['naam']."</td>
<td><span id='tijd".$dt."'></span></td>
</tr>";
}
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Mon May 30, 2011 7:01 pm
Can you post the full code ? It looks like you made a mess of the echo line
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Mon May 30, 2011 7:02 pm
$sql_actielist = mysql_query("SELECT * FROM actie WHERE acnaam = '".$naam."'") or die(mysql_error());
if(mysql_num_rows($sql_actielist) <= '0'){
echo "<tr><td colspan='2'>Je bent nu niets aan het doen.<br /></td></tr>";
} else {
echo '
<script type="text/javascript">
window.onload=WindowLoad;
function WindowLoad(event){';
while($actie= mysql_fetch_assoc($sql_actielist)){
$time = $actie['time'] - time();
$tt++;
echo 'ActivateCountDown("tijd'.$tt.'", '.$time.' );';
}
echo '
}
</script>';
$sql_actielist = mysql_query("SELECT * FROM actie WHERE acnaam = '".$naam."'") or die(mysql_error());
while($actie= mysql_fetch_assoc($sql_actielist)){
$dt++;
echo "
<tr>
<td>".$actie['naam']."</td>
<td><span id='tijd".$dt."'></span></td>
</tr>";
}
}
Edit: its inside a table but that can't be the problem. can it?
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Mon May 30, 2011 7:30 pm
Well you do not need to run the same query twice, and can you post the code of the ActivateCountDown function ?
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Mon May 30, 2011 9:50 pm
Sure, Why not.
var _countDowncontainer=0;
var _currentSeconds=0;
function ActivateCountDown(strContainerID, initialValue) {
_countDowncontainer = document.getElementById(strContainerID);
if (!_countDowncontainer) {
alert("count down error: container does not exist: "+strContainerID+
"\nmake sure html element with this ID exists");
return;
}
SetCountdownText(initialValue);
window.setTimeout("CountDownTick()", 1000);
}
function CountDownTick() {
if (_currentSeconds <= 0) {
window.location.reload();
return;
}
SetCountdownText(_currentSeconds-1);
window.setTimeout("CountDownTick()", 1000);
}
function SetCountdownText(seconds) {
//store:
_currentSeconds = seconds;
//get minutes:
var minutes=parseInt(seconds/60);
//shrink:
seconds = (seconds%60);
//get hours:
var hours=parseInt(minutes/60);
//shrink:
minutes = (minutes%60);
//build text:
var strText = AddZero(hours) + ":" + AddZero(minutes) + ":" + AddZero(seconds);
//apply:
_countDowncontainer.innerHTML = strText;
}
function AddZero(num) {
return ((num >= 0)&&(num < 10))?"0"+num:num+"";
}
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Tue May 31, 2011 11:14 am
The var _countDowncontainer=0; variable is global, meaning every time you call this function you overwrite the element it is applied to. you will have to either pass the element to the other two functions as a parameter, or create a function that does everything all in one function.
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Fri Jun 03, 2011 9:04 pm
jacek wrote: The var _countDowncontainer=0; variable is global, meaning every time you call this function you overwrite the element it is applied to. you will have to either pass the element to the other two functions as a parameter, or create a function that does everything all in one function.
I have no clue how I can do that! I'm fairly new to JavaScript. It would be nice if you could explain me how to do it.
What I tried to do is this:
function ActivateCountDown(strContainerID, initialValue, _currentSeconds, _countDowncontainer) {
_countDowncontainer = document.getElementById(strContainerID);
if (!_countDowncontainer) {
alert("count down error: container does not exist: "+strContainerID+
"\nmake sure html element with this ID exists");
return;
}
SetCountdownText(initialValue);
window.setTimeout("CountDownTick()", 1000);
}
function CountDownTick() {
if (_currentSeconds <= 0) {
window.location.reload();
return;
}
SetCountdownText(_currentSeconds-1);
window.setTimeout("CountDownTick()", 1000);
}
function SetCountdownText(seconds) {
//store:
_currentSeconds = seconds;
//get minutes:
var minutes=parseInt(seconds/60);
//shrink:
seconds = (seconds%60);
//get hours:
var hours=parseInt(minutes/60);
//shrink:
minutes = (minutes%60);
//build text:
var strText = AddZero(hours) + ":" + AddZero(minutes) + ":" + AddZero(seconds);
//apply:
_countDowncontainer.innerHTML = strText;
}
function AddZero(num) {
return ((num >= 0)&&(num < 10))?"0"+num:num+"";
}
Adding the currentSeconds to the countdown function.
jacek
Site Admin
Posts: 3262 Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:
Post
by jacek » Fri Jun 03, 2011 9:18 pm
You could try writing your own function based on this one that you copied from some random forum presumably
It's always easier to make modifications when you understand what's going on.
With so many functions like this and using global variables it's going to be difficult to keep track of which elements have what time left.
sevvlor
Posts: 22 Joined: Fri May 06, 2011 10:46 pm
Post
by sevvlor » Fri Jun 03, 2011 9:20 pm
jacek wrote: You could try writing your own function based on this one that you copied from some random forum presumably
It's always easier to make modifications when you understand what's going on.
With so many functions like this and using global variables it's going to be difficult to keep track of which elements have what time left.
True, I'll give it a shot I'll tell you when (if) it works.