CODEWITHSUNDEEP
jqueryajaxhtml-tablerowtoggle
Lord Varlin
Lord Varlin

Reputation: 834

Using jQuery to hide/show table row for posting a reply

I am building a bulletin board system that we can post a message to and people can reply to the message. I have posting a new message working fine, and for every new message, I use AJAX to create a new table row for each message:

<table id="content-table">
<tr>

  <th scope="col" class="messagetime"> <? echo $time; ?> </th>
  <th scope="col" class"message body"></th>
  <th scope="col" class="messagereply"><form method="GET" action="Rindex.php"><input name="id" type="hidden" value="<? echo $id; ?>"><button type="submit" style="border-style:none;" class="post-icon" /></form></th>

</tr>
</table>

In the last column, I have an image that they press that I would like jQuery to create a new table row below this one with fields for entering a reply message, which will post to that specific message.

I can currently get a new row for every message and hide/show all of them, but I am not able to figure out how to get the reply button to target the unique row to reply a message:

<table id="content-table">
<tr>

  <th scope="col" class="messagetime"> <? echo $time; ?> </th>
  <th scope="col" class"message body"></th>
  <th scope="col" class="messagereply"><form method="GET" action="Rindex.php"><input name="id" type="hidden" value="<? echo $id; ?>"><button type="submit" style="border-style:none;" class="post-icon" /></form></th>

</tr>

<tr id="replyrow" class="replyrow">

 <th scope="col"></th>
 <th scope="col" class="replyrowcontent"> <Post Reply Form would be in here.> </th>
 <th scope="col"></th>

</tr>
</table>

Any suggestions? I have a feeling there is going to be something involved with a parent/child relationship, but I conceptualize this in my head!

Upvotes: 0

Views: 2335

Answers (1)

Val
Val

Reputation: 17522

<div stlye="disply:none;" id="hidden">
    Hidden
</div>



<script>
$.ajax({
   /* ... other options here... */
   success: function (){
       $('#hidden').show();
   }
});
</script>

Now obviously you need a bit of research ... as well you can also use the click() method and put the ajax there, or something like that...

Oops forgot to give you a link http://api.jquery.com/jQuery.ajax/

good luck, if you have more questions use the box below [comment] and I'll answer your questions if any

Upvotes: 1

Related Questions