jQuery

Question

I'm trying to put a reply button for each comment so when someone click on the button (for example "Reply"), a textbox will come up automatically where users can fill in a form.

I didn't do much so far...

PHP

<div id='replycomment' class='reply' onclick='jsReply($comment_id);'>Reply</div>
<div id='showreply'></div>

function jsReply(comment_id) {
    var form = '<form id="showReplyForm" action"add_reply.php" method="post">';
    form += '<textarea name="replybody" cols="35" rows="2" maxlength="299"</textarea>';
    form += '<input type="hidden" name="replybodyId" value="' + comment_id + '" />'
    form += '<input type="submit" name="replysubmit" value="Reply"/></form>';
    jQuery('#replybody').replaceWith(form); }

Can anyone PLEASE help me with that? it would be much appreciated. I'm a bit confused with the way I need to link the id from jquery to php...

Thank you

Smern · Accepted Answer · 2013-04-19 23:11:47Z

To make your code work, do this: http://jsfiddle.net/MaqLQ/1/

within head:

var jsReply = function(comment_id) {
    var form = '<form id="showReplyForm" action"add_reply.php" method="post">';
    form += '<textarea name="replybody" cols="35" rows="2" maxlength="299"></textarea>';
    form += '<input type="hidden" name="replybodyId" value="' + comment_id + '" />';
    form += '<input type="submit" name="replysubmit" value="Reply"/></form>';
    jQuery('#showreply').replaceWith(form);
}

you were missing a semi-colin at the end of one of your form concatenations. you were looking at 'replyBody' rather than the 'showreply' that exists in your html, and if your code wasn't global your html it wouldn't have been defined for the onclick. you were also missing the end angle bracket for your opening textarea tag.

also, i don't know your context and i'm not here for a code review, but among a few other things... you should really avoid using onclick within your html elements.

O P · Accepted Answer · 2013-04-19 22:58:35Z

1

I recommend using the jQuery library.

Hide #showreply via CSS display: none; and place the HTML form within it.

$('#replycomment').click(function() {
    $('#showreply').show();
});

I also recommend changing your IDs to classes since you will have multiple instances.

answered Apr 19, 2013 at 22:58

O P

2,37511 gold badges42 silver badges75 bronze badges

Comments

Arnelle Balane · Accepted Answer · 2013-04-19 23:05:22Z

1

PHP

<div class='reply'>Reply</div>
<form action='add_reply.php' method='POST' class='reply-form'>
  <textarea name='replybody'></textarea>
  <input type='hidden' name='comment_id' value='<?php echo $comment_id; ?>' />
  <input type='submit' value='Reply' />
</form>

CSS

.reply-form {
  display: none;
}

Javascript

$(".reply").click(function() {
  $(this).siblings(".reply-form").show();
  $(this).hide();
});

answered Apr 19, 2013 at 23:05

Arnelle Balane

5,4951 gold badge28 silver badges32 bronze badges

Collectives™ on Stack Overflow

jQuery - Display a textbox when a link/button is clicked

PHP

jQuery

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

PHP

jQuery

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related