Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 288
  • Last Modified:

Dynamically added form doesn't found in dom?

I'm trying to create a comment module that allows people to reply to comments made by others. For example, if I commented something on someone's website, someone else can reply to my comment (comments nesting).

I have the code below to dynamically add the comment form when someone clicks reply but for some reason DOM can't see it. Any ideas?
$('#add_comment').ajaxForm({
	type: 'post',
	dataType:  'json', 
	beforeSubmit: function() {

	},
	success: function(data) {
		if (data.status == 'success')
		{
			$('#comments').prepend('<table><tr><td>' + data.message + '<a href="#" id="reply">reply</a></td></tr></table><br />');
		}
	}
});

$('a#reply').live('click', function(event) {
	$(this).after('<br /><form action="backstage/dashboard/ajax_add_comment" method="post" accept-charset="utf-8" name="add_comment" id="add_comment"><table><tr><td></td><textarea name="comment" cols="50" rows="5" id="comment" ></textarea><input type="submit" name="button" value="Submit" id="button" class="button"  /></tr></table></form>')
	return false;
});

Open in new window

0
dsrnu
Asked:
dsrnu
5 Solutions
 
Kiran SonawaneProject LeadCommented:
If there are multiple comments, there are multiple reply with same ID. May be this causes problem to identify the dom. Ideally, dom id should be unique.
0
 
Ivo StoykovCommented:
text area is out of the cell
should be

$(this).after('<br /><form action="backstage/dashboard/ajax_add_comment" method="post" accept-charset="utf-8" name="add_comment" id="add_comment"><table border="1"><tr><td><textarea name="comment" cols="50" rows="5" id="comment" > </textarea><input type="submit" name="button" value="Submit" id="button" class="button"  /></td></tr></table></form>')

HTH

Ivo Stoykov
0
 
evedderCommented:
also when you create dynamic elements with jquery, you should use the .live() method instead of .click()
check the info here http://api.jquery.com/live/ it explains how it works and why dynamic created elements dont respond the same way
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
dsrnuAuthor Commented:
still not working..
0
 
Ivo StoykovCommented:
add a prompt and see what's in there, i.e.

$('a#reply').live('click', function(event) {
      $(this).after('<br /><form action="backstage/dashboard/ajax_add_comment" method="post" accept-charset="utf-8" name="add_comment" id="add_comment"><table><tr><td></td><textarea name="comment" cols="50" rows="5" id="comment" ></textarea><input type="submit" name="button" value="Submit" id="button" class="button"  /></tr></table></form>')
prompt('d', this.innerHTML);
      return false;
});
0
 
leakim971PluritechnicianCommented:
>still not working..

Did you understood sonawanekiran comment?
If you did not understand him, you may ask him to give you more info about the resolving
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now