Defining DOM html objects.

[iPixel]

I have a script that through php generates rows of data.

<tr>
  <td id="generatedbyphp"> data here </td>
</tr>

 

I'm trying to use javascript to change the background of any given id which are randomly generated. I have the code to do it and it works fine on predefined ID's. But that will not work on ID's that have been generated by the php script because these id's have not been defined in the html DOM objects so while u see it... to javascript it does not exists and i get an "Object Required" js error.

 

Does anyone know how to work around this and/or how i could define the objects as they are being created so that the javascript can recognize it's existance?

 

Thanks!

[Alex]

Hard-coding the ids of the elements or having PHP generate them makes no difference to JavaScript. You must be doing something else wrong, and we can't really help without more relevant information.

[iPixel]

I beg to differ since the 1 static ID that i have pre-created works just fine. But i'll happily hope you prove me wrong.

 

The TD where i genereate ID which points to the cell i want changed.

This time here you have the whole php script that generates the rows.

<?php
$qry=mysql_query("SELECT firstname, lastname, filenumber  FROM syx_ad WHERE managerid = '$usr_filenumber'");
							do
								{
								?>    
                                <tr>
                                <td nowrap="nowrap" style="border-bottom:1px solid #ffffff; background-position:right; 
			background-repeat:no-repeat;" [b]id="<?php echo $res['filenumber']; ?>"[/b]>                                    <a href="etime.php?sd=<?php echo $sd; ?>&eu=<?php echo $res['filenumber']; ?>" style="text-decoration:none; color:#000000; font-weight:bold;">
								<?php echo $res['firstname'] . " " . $res['lastname']; ?>
                                    </a>
                                </td>
                                </tr>
								<?php                                    
								}
							while($res = mysql_fetch_assoc($qry))
?>

 

At the very bottom of the page once all of the ID's have been created i call a javascript function like so. This is also tested and works on manually entered ID's. I used the alerts to test that the values are being passed properly, and they are.

 

<?php
			if(isset($_GET['eu']))
				{
					$etime_who = $_GET['eu'];
					?>
                        <script language="javascript" type="text/javascript">
					var etimeuser = "<?php echo $etime_who; ?>";
					var etimeold = "<?php echo $usr_filenumber; ?>";
					//alert("A - New " + etimeuser);
					//alert("A - Old " + etimeold);
					UserViewed(etimeuser,etimeold);
					</script>
                        <?php
				}
			else
				{
					$etime_who = $usr_filenumber; # Filenumber used to identify user being viewed. Used in function call.
                        ?>
                        <script language="javascript" type="text/javascript">
					var etimeuser = "<?php echo $etime_who; ?>";
					var etimeold = "<?php echo $usr_filenumber; ?>";
					//alert("B - New " + etimeuser);
					//alert("B - Old " + etimeold);
					UserViewed(etimeuser,etimeold);
					</script>
                        <?php
				}

?>

 

And finally here's the javascript code that works on the manually created ID's but refuses to on the dynamically created ID's. Again alerts were used to test that the data was passed and still correct. This also works.

<script language="javascript" type="text/javascript">
function UserViewed(tdid,oldid)
{
	//alert(tdid + " is the id that should change");			
	document.getElementById(oldid).style.backgroundImage = "";
	var newImage = "url(images/tab_bg.jpg)";
	document.getElementById(tdid).style.backgroundImage = newImage;
}
</script>

 

And the error i get is....

Object Required

 

which it's talking about the ID that it's trying to find in it's registered DOM objects but as i mentioned before, dynamically created ID's dont register as manually created ID's do.

 

I hope you prove me wrong.

Thanks for taking the time.

[Alex]

The DOM has no idea that PHP generated the HTML, it isn't concerned. PHP just outputs the HTML and sends to the browser. So whether it's hard-coded or generated from PHP as long as the output is correct it will work. I'm guessing your PHP is either generating malformed HTML so your elements aren't be created properly, or the ids aren't what you're expecting. What you should do is look at the HTML output from your PHP file to see what's wrong.

 

I'm not sure why you're using a do..while() loop. That doesn't really make much sense: the first loop $res will be undefined.

[iPixel]

i need to use something along the lines of

document.createElement("<?php echo $res['filenumber']; ?>"

 

 

HTML output is fine, with no errors at all.

 

as for the do while... that doesnt change the issue.

[iPixel]

Here's an output example of the generated ID.

<td nowrap="nowrap" style="border-bottom:1px solid #ffffff; background-position:right; 
			background-repeat:no-repeat;" id="002707">
                                    <a href="etime.php?sd=cur&eu=002707" style="text-decoration:none; color:#000000; font-weight:bold;">
								iPixel                                    </a>
                                </td>

[haku]

HTML Ids should not start with digits. It can cause problems. Prefix the ID with at least one letter, and take it from there.

[Alex]

Your code doesn't really make much sense, and I'm not really sure what you're trying to do. Take this part for example:

 

$etime_who = $usr_filenumber; # Filenumber used to identify user being viewed. Used in function call.
                        ?>
                        <script language="javascript" type="text/javascript">
					var etimeuser = "<?php echo $etime_who; ?>";
					var etimeold = "<?php echo $usr_filenumber; ?>";

$etime_who and $usr_filenumber contain the same thing, so you're passing the same value to the function in 2 parameters.

[iPixel]

This is because at times $etime_who should be the same as $usr_filenumber and at times it will not be hence why i use both variables... Im not sure why you're dwelling on parts of the code that work and arent even the issue here.

[iPixel]

Unfortunately that did not fix the problem. But thanks!

 

HTML Ids should not start with digits. It can cause problems. Prefix the ID with at least one letter, and take it from there.

 

 

[iPixel]

I once had a similar problem using dynamically created <select> boxes, and had the same error. The way i got around that was pre-creating the <select> tags with the id in them, and generation the <options> only.

I cannot do that in this case however, and it's driving me nuts.

[KevinM1]

Are you using Firebug?  Can you pinpoint exactly where (line number) the error is occurring?

[iPixel]

Firebug as in the FF addon? Nope but i'll take a look!

[iPixel]

Are you using Firebug?  Can you pinpoint exactly where (line number) the error is occurring?

 

Haha AWESOME!!! it was an error on my part afterall. Firebug didnt exactly show me the error but the way it displayed the structure showed me what was wrong. I repeated 1 ID twice which cased js to bug out.

 

Thanks Nightslyr, and all who tried to help!