Question

Here is my code:

<?php foreach ($users as $user)
{
   //some php code here to define variables
   <a href="<?php echo ADDRESS; ?>messageSent.php?id=<?php echo $id_to; ?>" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" >
      <?php echo $uniqueCode1;?><span class="pink_text"><?php echo $uniqueCode2;?></span><?php echo $uniqueCode3;?>
   </a>      
   <form id="message_area_<?php echo $id_to; ?>" style="display:none"  method="post" action="<?php echo ADDRESS; ?>messageSent.php?id=<?php echo $id_to; ?>"> 
       <textarea name="message" rows="10" cols="20"></textarea>
       <input name="Submit" type="submit" value="Send"></input>
       <input type='hidden' name='mid' id='message_id' value=""></input>
   </form>
 <?php
  }
 ?>

then i have:

<script type="text/JavaScript">
function showMessageArea(link)
{
  document.getElementById('message_id').value = this.id;
  var message_area = document.getElementById('message_area_'+this.id);
  message_area.parentNode.removeChild(message_area);
  link.parentNode.insertBefore(message_area, link.nextSibling);
  message_area.style.display="block";
}

my pagesource shows this: note that form id is unique

<a href="http://www-rainbowcode-mobi/messageSent.php?id=36" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" > 
    KUZELJA<span class="pink_text">000</span>RC
</a>      
<form id="message_area_36" style="display:none"  method="post" action="http://www-rainbowcode-mobi/messageSent.php?id=36"> 
   <textarea name="message" rows="10" cols="20"></textarea> 
   <input name="Submit" type="submit" value="Send"></input> 
   <input type='hidden' name='mid' id='message_id' value=""></input> 
</form> 
<a href="http://www-rainbowcode-mobi/messageSent.php?id=38" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" > 
   ALANZIM<span class="pink_text">000</span>RC 
</a>      
<form id="message_area_38" style="display:none"  method="post" action="http://www-rainbowcode-mobi/messageSent.php?id=38"> 
   <textarea name="message" rows="10" cols="20"></textarea> 
   <input name="Submit" type="submit" value="Send"></input> 
   <input type='hidden' name='mid' id='message_id' value=""></input> 
</form> 

the problem NOW is: in my JS this.id is undefined????? THUS NOT showing my textarea and sumbit button
how can i get var message_area = document.getElementById(‘message_area_’+this.id) unique???
i also tried to split.link(“=”)[1] to get id and concatenate it with message_area_
but it is not working
link is also unique, http://www-rainbowcode-mobi/messageSent.php?id=36 where id will be the id of the uniquecode link i clicked on

PLEASE i need help?
thank you

Answer 1

There are two options:

1) add id="<?php echo $to_id; ?>" to your <a> tags, OR

2) better pass the id as javascript function parameter:

<a ... onclick="showMessageArea(this, '<?php echo $to_id; ?>'); return false;">

and then your javascript function should look like this

function showMessageArea(link, id)
{
    document.getElementById('message_id').value = id;
    var message_area = document.getElementById('message_area_'+id);
    ....
}