Meteor show update field instead of item if update clicked -
i have simplest meteor project ever, i'm stuck @ basic. have 1 form field, , when enter item goes mongo collection. retrieve , display collection, along buttons delete or edit. want happen click edit, , item becomes text box (prepopulated original value) can change, hit return, , have item updated. i'm stuck @ how pass _id along and/or how convert correct entry field.
my .html file:
<head> <title>memorial</title> </head> <body> <h1>memorial testing!</h1> <form class="new-task"> <input type="text" name="text" placehoder="type stuff here" /> </form> {{> listing}} </body> <template name="listing"> <ul> {{#each tasks}} {{> crudlist}} {{/each}} </ul> </template> <template name="crudlist"> {{#if editor}} {{#if editid == this._id}} <li><input type="text" name="text" placehoder="type stuff here" value="{{text}}"/></li> {{else}} <li>{{text}} :: <button name="delete" class="delete">delete</button><button name="edit" class="edit">edit</button></li> {{/if}} {{/if}} </template>
my .js file:
tasks = new mongo.collection("tasks"); if (meteor.isclient) { template.listing.helpers({ tasks: function() { return tasks.find({}); } }); template.crudlist.helpers({ editor: function() { return session.get("editor"); }, editid: function() { return session.get("editid"); } }); template.body.events({ "submit .new-task": function (event) { var text = event.target.text.value; tasks.insert({ text: text, createdat: new date() }); event.target.text.value = ""; return false; } }); template.crudlist.events({ "click .delete": function () { tasks.remove(this._id); }, "click .edit": function () { session.set("editor","true"); session.set("editid",this._id); } }); } if (meteor.isserver) { meteor.startup(function () { // code run on server @ startup }); }
thanks help.
to you've clicked on should use event.target documentation http://docs.meteor.com/#/full/eventmaps.
template.crudlist.events({ "click .delete": function (event,template) { var whatyoujustclicked = event.target, targetid = $(whatyoujustclicked).attr('id') }, "click .edit": function (event,template) { var whatyoujustclicked = event.target, targetid = $(whatyoujustclicked).attr('id') session.set("editor","true"); session.set("editid",targetid); }
});
Comments
Post a Comment