Search code examples
meteormeteor-blaze

Submitting data through forms into a collection


I'm creating a feedback modal that allows the users to submit me a feedback about the webpage. The code for the form inside the modal is:

 <div class="modal-body">

 <form class='feedbackForm'>
 <div class="form-group">
 <label for="form-control">Feedback</label>
 <input type="text" class="form-control" name="feedbackForm" 
 id="feedbackForm" placeholder="Feedback">
 </div>

 <div class="modal-footer">
 <button type="button" class="btn btn-secondary" data-
 dismiss="modal">Close</button>
 <button type="submit" class="btn btn-primary">Submit Feedback</button>
 </div>

 </form>
 </div>

and the helper for the same is :

"submit .feedbackForm": function(event){
var Feedbackvar = event.target.Feedbackvar.value;

//Insert feedback
Feedback.insert({
  FeedbackData: 'Feedbackvar'
});
}

Also, I'm using the collections 2 package and have defined a schema for the feedback collection:

Feedback = new Mongo.Collection("feedback");
Feedback.attachSchema(new SimpleSchema({
FeedbackData:{
type: String
},

userId:{
type: String,
autoValue: function(){
  return Meteor.userId()
}
},

CreatedAt:{
  type: Date,
  autoValue: function(){
    return new Date()
  }
}
}));

The problem is I am not able to insert the feedback to the collection with the help of the form, but with the help of the console, I can insert the data.


Solution

  • There's a lot wrong here, but the following should provide a quick fix:

    • Change event.target.Feedbackvar.value to event.target.feedbackForm.value
    • Take Feedbackvar out of quotes in your insert - this is just trying to insert the string "FeedbackVar"

    Those changes should make it work, but you'll still want to spend time reviewing this whole thing - for example, your form has class feedbackForm, which is the same as the name of your input as well as its id - very confusing.

    You might also want to consider a textarea rather than a simple text input for a feedback form.