jquery to generate dynamic list
I want to dynamically add comments to an html list .But the comments
should go in the specific list according to the form from which it is
sent. Say if it is from form id=1 then it should go in form id=1 and if it
is from form id=2 then it should go in the list form id=2 Here is my code.
I had already wasted many hours upon researching through it on web. Please
help..
<!DOCTYPE html>
<html>
<head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10/jquery.min.js">
</script>
<script>
var user_name = 'Danil';
$(document).ready(function() {
$('.comment_entry form').submit(function (e) {
e.preventDefault();
var currentId=$('form',this).attr('id');
var comment = $("input[type='text',id=currentId]").val();
$(".comments#"+currentId).append('<li><a class="commenter_name"
href="/">' + user_name + '</a>' + comment + '</li>');
$("input[type='text',id=currentId]").val("");
});
});
</script>
</head>
<body>
<ul id="1" class="comments">
</ul>
<div class="comment_entry">
<form id="1" method="post" >
<input id="1" type="text" placeholder="Leave comment" />
<input type="submit" value="submit" />
</form>
</div>
<ul id="2" class="comments">
</ul>
<div class="comment_entry">
<form id="2" method="post" >
<input id="2" type="text" placeholder="Leave comment" />
<input type="submit" value="submit" />
</form>
</div>
</body>
</html>
No comments:
Post a Comment