Poll System

Im making a poll system and it displays the results bar moves to the percentage it is.

Here is my code.

Code:

<?
include("dbconnect.php");
$query = mysql_query("SELECT * FROM `polls` WHERE `active` = 'True' ORDER by `id` ASC LIMIT 1") or die($database_error);
$nu_active = mysql_num_rows($query);
if($nu_active == "0") {
   echo "There are no active polls in the database.";
}else{
$r = mysql_fetch_array($query);
$total = mysql_result(mysql_query("SELECT COUNT(id) FROM`poll_votes` WHERE `poll_id` = '$r[id]' AND `ip` = '$ip'"),0);
if($total != 0) {
   echo "<b>$r[question]</b><br>";
$tvotes = mysql_result(mysql_query("SELECT COUNT(id) FROM `poll_votes` WHERE `poll_id` = '$r[id]'"),0);
$pollwidth = "250";
$time2show = "30";
$count = 0;
for ($i = 1; $i <= 10; $i++) {
$ari = "op";
$ari .= "$i";
if ($r[$ari] != "") {
if ($count != "0") {
   echo '<br>';
}
$votes_op2 = mysql_result(mysql_query("SELECT COUNT(id) FROM `poll_votes` WHERE `poll_id` = '$r[id]' AND `op_id` = '$i'"),0);
$votes_op = array(
"$i" => "$votes_op2",
);
$ratio = @Round(($votes_op[$i] / $tvotes) * 100);
$ratio_opt[$count + 1] = $ratio;
$rightwidth_opt[$count + 1] = 100-$ratio_opt[$count + 1];
?>
<table>
<tr>
<td>
<table style="border: 1px solid #000000" border="0" cellpadding="0" cellspacing="0" width="<? echo $pollwidth; ?>" height="11">
<tr>
   <td bgcolor="#ADE393" width="0%" id="ratio_<? echo $count + 1; ?>"></td>
   <td width="100%" id="rightwidth_<? echo $count + 1; ?>"></td>
</tr>
</table>
<td>
<td><div id="pollpercent_<? echo $count + 1; ?>">0%</div>
</td>
<tr>
</table>
<?
   $count++;
}
}
?>
<script>
<?
$x = "1";
while($x <= $count) {
?>

var ratio_<? echo $x; ?> = 1;
var rightwidth_<? echo $x; ?> = 99;

update_poll_bar_<? echo $x; ?>()
function update_poll_bar_<? echo $x; ?>(){
if(ratio_<? echo $x; ?> <= <? echo $ratio_opt[$x]; ?>) {
document.getElementById('ratio_<? echo $x; ?>').width = ratio_<? echo $x; ?>;
document.getElementById('pollpercent_<? echo $x; ?>').innerHTML = ratio_<? echo $x; ?> + "%";
document.getElementById('rightwidth_<? echo $x; ?>').width = rightwidth_<? echo $x; ?>;
ratio_<? echo $x; ?>++;
rightwidth_<? echo $x; ?>--;
setTimeout("update_poll_bar_<? echo $x; ?>()",<? echo $time2show; ?>)
}else{
clearTimeout("update_poll_bar_<? echo $x; ?>()")
}
}
<?
$x++;
}
?>
</script>
<?
}
}
?>

This is how it displays in the browser

Code:

<b>This is a test poll?</b><br><table>
<tr>
<td>
<table style="border: 1px solid #000000" border="0" cellpadding="0" cellspacing="0" width="250" height="11">
<tr>
   <td bgcolor="#ADE393" width="0%" id="ratio_1"></td>
   <td width="100%" id="rightwidth_1"></td>
</tr>
</table>
<td>
<td><div id="pollpercent_1">0%</div>

</td>
<tr>
</table>
<br><table>
<tr>
<td>
<table style="border: 1px solid #000000" border="0" cellpadding="0" cellspacing="0" width="250" height="11">
<tr>
   <td bgcolor="#ADE393" width="0%" id="ratio_2"></td>
   <td width="100%" id="rightwidth_2"></td>
</tr>
</table>

<td>
<td><div id="pollpercent_2">0%</div>
</td>
<tr>
</table>
<script>

var ratio_1 = 1;
var rightwidth_1 = 99;

update_poll_bar_1()
function update_poll_bar_1(){
if(ratio_1 <= 67) {
document.getElementById('ratio_1').width = ratio_1;
document.getElementById('pollpercent_1').innerHTML = ratio_1 + "%";
document.getElementById('rightwidth_1').width = rightwidth_1;
ratio_1++;
rightwidth_1--;
setTimeout("update_poll_bar_1()",30)
}else{
clearTimeout("update_poll_bar_1()")
}
}

var ratio_2 = 1;
var rightwidth_2 = 99;

update_poll_bar_2()
function update_poll_bar_2(){
if(ratio_2 <= 33) {
document.getElementById('ratio_2').width = ratio_2;
document.getElementById('pollpercent_2').innerHTML = ratio_2 + "%";
document.getElementById('rightwidth_2').width = rightwidth_2;
ratio_2++;
rightwidth_2--;
setTimeout("update_poll_bar_2()",30)
}else{
clearTimeout("update_poll_bar_2()")
}
}
</script>

In FireFox this displays as
------ 34%
------ 33%

But it should go to
------ 67%
------ 33%

In Internet explorer this works fine.

And when the first option is 100% both browsers do not work and IE give a error. (when the ff one works ok)

Line: 39
Char: 1
Error: Invalid argument.

And this is the code what that gives the error on ie.

Code:

<b>This is a test poll?</b><br><table>
<tr>
<td>
<table style="border: 1px solid #000000" border="0" cellpadding="0" cellspacing="0" width="250" height="11">
<tr>
   <td bgcolor="#ADE393" width="0%" id="ratio_1"></td>
   <td width="100%" id="rightwidth_1"></td>
</tr>
</table>
<td>
<td><div id="pollpercent_1">0%</div>
</td>
<tr>
</table>
<br><table>
<tr>
<td>
<table style="border: 1px solid #000000" border="0" cellpadding="0" cellspacing="0" width="250" height="11">
<tr>
   <td bgcolor="#ADE393" width="0%" id="ratio_2"></td>
   <td width="100%" id="rightwidth_2"></td>
</tr>
</table>
<td>
<td><div id="pollpercent_2">0%</div>
</td>
<tr>
</table>
<script>

var ratio_1 = 1;
var rightwidth_1 = 99;

update_poll_bar_1()
function update_poll_bar_1(){
if(ratio_1 <= 100) {
document.getElementById('ratio_1').width = ratio_1;
document.getElementById('pollpercent_1').innerHTML = ratio_1 + "%";
document.getElementById('rightwidth_1').width = rightwidth_1;
ratio_1++;
rightwidth_1--;
setTimeout("update_poll_bar_1()",30)
}else{
clearTimeout("update_poll_bar_1()")
}
}

var ratio_2 = 1;
var rightwidth_2 = 99;

update_poll_bar_2()
function update_poll_bar_2(){
if(ratio_2 <= 0) {
document.getElementById('ratio_2').width = ratio_2;
document.getElementById('pollpercent_2').innerHTML = ratio_2 + "%";
document.getElementById('rightwidth_2').width = rightwidth_2;
ratio_2++;
rightwidth_2--;
setTimeout("update_poll_bar_2()",30)
}else{
clearTimeout("update_poll_bar_2()")
}
}
</script>

But the above code works in FF but not IE.

Need help real bad.

Thanks,
Daniel

shamil

replace

Code:

.width

with

Code:

.style.width

It will solve error.

DanielXP

shamil wrote:

replace