Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Assigning AJAX output to div tag

Status
Not open for further replies.

nielse63

Technical User
Sep 8, 2009
12
0
0
US
In this AJAX based voting sequence the output is always being displayed in the last div tag, no matter which div or form the input information is coming from. I would like the result to be so that when a user clicks on the first question, the result is displayed in the first div tag, and for the second question, the second div tag. Here's the code:

HTML:
Code:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<script type="text/javascript" src="poll1.js"></script>
<div id="poll1">
<form name="form1">
Good
<input type="radio" name="vote1" value="0" onclick="getVote1(this.value)" /> Bad
<input type="radio" name="vote1" value="1" onclick="getVote1(this.value)" />
</form>
</div>

<script type="text/javascript" src="poll2.js"></script>
<div id="poll2">
<form name="form2">
Good
<input type="radio" name="vote2" value="0" onclick="getVote2(this.value)" /> Bad
<input type="radio" name="vote2" value="1" onclick="getVote2(this.value)" />
</form>
</div>
</body>
</html>

JS:
Code:
var xmlhttp;

function getVote1(int)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
  {
  alert ("Browser does not support HTTP Request");
  return;
  }
var url="poll1.php";
url=url+"?vote1="+int;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}

function stateChanged()
{
  if (xmlhttp.readyState==4)
  {
  document.getElementById("poll1").innerHTML=xmlhttp.responseText;
  }
}

function GetXmlHttpObject()
{
var objXMLHttp=null;
if (window.XMLHttpRequest)
  {
  objXMLHttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {
  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
return objXMLHttp;
}

PHP:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<?php
$vote1 = $_REQUEST['vote1'];

//get content of textfile
$filename = "poll1.txt";
$content = file($filename);

//put content in array
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];

if ($vote1 == 0)
  {
  $yes = $yes + 1;
  }
if ($vote1 == 1)
  {
  $no = $no + 1;
  }

//insert votes to txt file
$insertvote = $yes."||".$no;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>

<strong>Result:</strong>
<table>
<tr>
<td>Good:</td>
<td>
<img src="poll.jpg"
width='<?php echo(100*round($yes/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($yes/($no+$yes),2)); ?>%
</td>
</tr>
<tr>
<td>Bad:</td>
<td>
<img src="poll.jpg"
width='<?php echo(100*round($no/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($no/($no+$yes),2)); ?>%
</td>
</tr>
</table> 
</body>
</html>

As you can see, there are two JS files and two PHP files being called here, but for the sake of space I only put one of each.

Any help on this?
 
Are you using the same 'stateChanged' function for each, or have multiple 'stateChanged' functions? If the answer to either of those is 'yes', then that's your problem.

If you'd posted all the code, we'd have been able to see that, of course!

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top