Hi, everyone. I’m new to meteor so please ignore any stupidity in this question. I am using CollectionFS and GridFS to upload my images. When I submit my form, the contents are delivered, but I have to refresh the page in order for the images to display. Can anyone help me overcome this? Pages shout not have to refresh after a single file upload as that would amount to very poor user experience.
Client side code is;
Template.submit.events({
"submit form": function(event) {
var name = event.target.name.value;
var file = $('#productImage').get(0).files[0];
if (file) {
fsFile = new FS.File(file);
ProductsImages.insert(fsFile, function(err, result) {
if (!err) {
var productImage =
'/cfs/files/ProductsImages/' +
result._id;
Posts.insert({
name: name,
image: productImage
});
}
});
} else {
var productImage = 'public/img/male.png';
Posts.insert({
name: name,
image: productImage
});
}
event.target.name.value = "";
Router.go('/');
return false;
}
});
Lib code is;
Posts = new Mongo.Collection('posts');
ProductsImages = new FS.Collection("ProductsImages", {
stores: [new FS.Store.GridFS("ProductsImages")]
});
HTML is:;
{{#each posts}}
<li>This is my name: {{name}}</li>
<img src="{{image}}" height="100" width="100">
{{/each}}
Submit form
<input type="text" name="name" placeholder="name">
<input type="file" name="productImage" id="productImage">
<input type="submit" name="submit" value="submit">
</form >