Jump to content

[SOLVED] Javascript for id that contains a counter as part of the name


limitphp

Recommended Posts

On my page, there are a whole bunch of divs with id names of:

voteCount1, voteCount2, voteCount3, etc.

The number is generated by php code using a counter.

Each time the page is refreshed I don't know how many divs there will be.

 

Ok, now in my javascript, I'm trying to access these divs with this code:

document.getElementById("voteCount"+count).innerHTML=xmlHttp.responseText

Its not working.  The variable count somehow needs to be part of the name.

I remember that it is possible to do this, but I forgot how.

I wish I could just make a variable:

var = "voteCount"+count;

then just use that like this:

document.getElementById(var).innerHTML=xmlHttp.responseText

But I'm pretty sure yuo need to have quotes around the name, so it won't work, I don't think.

Any help would be really appreciated.

Link to comment
Share on other sites

Without more code it is hard to diagnose, that and this is a javascript issue not php.

 

But what you have should work although I would change this:

 

var = "voteCount"+count;

to

var countName = "voteCount" + count;

 

I would alret the countName and make sure it is what you expect it to be, cause as long as there is a div with that name, it should work flawlessly.

Link to comment
Share on other sites

I tried that, but it didn't work.

I'm trying to do exactly what digg does when you click the digg button to digg a story.

Only I call it vote instead and its for songs.

I want to use ajax to make the vote counter increase when you click vote without refreshing the whole page.

I have alot of code.  First, here's the php code where the div is:

<TD ALIGN="center" VALIGN="center" STYLE="background-color:#3F85CD">
<FONT STYLE="font-family:Helvetica; color:#FFFFE8; font-size:15px;">
	<DIV ID="voteCount<?php echo $greckleVoteCount?>" VALIGN="bottom">
                     <B><?php echo $totalVoteCount ?></B>
               </DIV>
</FONT>
<FONT STYLE="font-family:arial; color:#FFFFE8; font-size:11px; letter-spacing:1px">
	<BR>
	votes
</FONT>
</TD>
</TR>
<TR>
   <TD ALIGN="center" VALIGN="center" STYLE="background-color:#2A5A8B">
	<?php if ($loginExist==0){ ?>
        <A HREF="#" onClick="alert('You must be logged in to vote')" CLASS="greckleVote">vote</A>
	<?php }else { ?>
	   <A HREF="javascript:vote(<?php echo $recordVote[songID].",".$greckleVoteCount?>)" CLASS="greckleVote">vote</A>
	<?php } ?>
	</FONT>
</TD>
</TR>

Thats where the votes are displayed and also where they click vote and I call the vote() function.

Ok, now here is the vote function....

its in the vote.js file:

var xmlHttp

function vote(songID,counter)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="vote.php"
url=url+"?songID="+songID+"&itemCount="+counter
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
var countName = "voteCount" + counter;
document.getElementById(countName).innerHTML=xmlHttp.responseText 
} 
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
}
return xmlHttp;
}

Ok, now inside the vote function it calls the vote.php page.

Here is the vote.php page:

<?php
include("connGreckle.php");

//******************************* CHECK IF USER ALREADY VOTED FOR THIS SONG	*********************************

$songID=$_GET["songID"];
$itemCount=$_GET["itemCount"];

if (isset($_COOKIE['nwo'])) { 	//**********	CHECK FOR COOKIE
$query = "SELECT * FROM cookie WHERE tempID = '$_COOKIE[nwo]'";
$result = mysql_query($query);
$data = mysql_fetch_assoc($result);
if ($data<>""){ 				
	$userID = $data['userID'];		
} 
}

$queryCheck4Vote = "SELECT songID FROM vote WHERE songID = '$songID' AND userID = '$userID'";
$resultCheck4Vote = mysql_query($queryCheck4Vote);
$dataCheck4Vote = mysql_fetch_assoc($resultCheck4Vote);
if ($data<>""){ 				
	echo "No go";		
}else{
mysql_query("INSERT INTO vote (songID, date, userID) 
VALUES ('$songID', 'now()', '$userID')");
}

$sql="SELECT * FROM vote WHERE songID = $songID";

$result = mysql_query($sql);
echo mysql_affected_rows();
?>

 

Now, I'm really new to the ajax stuff, so this is pretty much modeled after the w3school website ajax example.

 

 

 

 

Link to comment
Share on other sites

I dont see anything wrong with doing:

 

document.getElementById("voteCount"+count);

 

or

 

var id = "voteCount" + count;
var div = document.getElementById(id);

 

But this is a javascript issue and should probably be posted elsewhere.

 

(my 2 cents - srsly, you should be using a javascript library like jQuery or Prototype)

Link to comment
Share on other sites

I got it working!

 

I started over and used the example in this forum at the top...the sticky that says Ajax a basic working example.

Awesome code!.....

 

sorry for posting in the wrong forum.....thanks for putting it in this one, and thanks for the great ajax example!

 

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.