Unable to add comments to a post in meteorjs

Question

Somehow I am not able to add comments to a particular post.The comments are not getting inserted to the mongo database.

Comments = new Mongo.Collection('comments');
Template.comments.helpers({
    'comment': function(){
        console.log(this._id);
        return Comments.find();

    }
});
Template.addComment.events({
        'click button':function(event){
            event.preventDefault();
            var madeBy = Meteor.user().username;
            var comment = document.getElementById('mycomment').value;
            var currentPost = this._id;


            Comments.insert({
                comment:comment,
                createdAt:new Date(),

                madeBy:madeBy,

            });
            document.getElementById('mycomment').value='';
        }
    });

The HTML code for comment page is:

<template name="comments">
    <h2><b>{{name}}</b></h2>

    {{> addComment}}
    <ul>
        {{#each comment}}
            <li>{{comment}}</li>
        {{/each}}
    </ul>
</template>


<template name='addComment'>
<input type='text' placeholder='Add comment here' name='comment' id ='mycomment'>
<button class="btn btn" type="button" id='btn'>Comment</button>
</template>

Here {{name}} refers to the name of post to which the comment has been made. Please help me out.Thankyou.

Answer 1

you should to put form element on your addComment template;

    <template name='addComment'>
    <form class="add-Comment">
    <input type='text' placeholder='Add comment here' name='comment' id ='mycomment'>
    <button class="btn btn" type="button" id='btn'>Comment</button>
    </form> 
    </template>

and then in your js file:

Template.addComment.events({
  'submit .add-Comment': function(event){
   ...  
  return false;
  }
});