[英]I'm trying to import Excel to Mongodb from Meteor, How can I get every _id to my documents?
[英]How can I get the input id from the submit event in meteor?
在一个模板中,我有:
<template name="moviesTemplate">
<form>
<ul>
{{#each movies}}
<li>
{{title}} <input id="{{title}}" type="submit" value="Delete" />
</li>
{{/each}}
</ul>
</form>
</template>
当用户在moviesTemplate上单击“删除”时,我想从我的javascript文件中的事件中找到输入元素的id属性:
Template.moviesTemplate.events = {
'submit': function (e, tmpl) {
e.preventDefault();
var theId = theButtonThatRaisedTheEvent.id.toString(); // <--- This is what I'm referring to
}
}
我如何找到这个元素? 我以为是“ e”,但似乎无法从中得到任何ID。 也许我误会了...
编辑1:
好的,看来'e'是事件,它不包含与source元素有关的任何信息。 我还应该怎么做才能做到这一点? 我需要重新考虑自己的做法吗?
对我来说,id似乎属于表单,而不属于Submit按钮。 我将使用以下内容:
<template name="main">
<form data-id="anId">
<input type="submit" value="Delete!">
</form>
</template>
Template.main.events({
'submit form': function(event, template){
event.preventDefault() // Don't submit it!
var id = event.currentTarget.getAttribute('data-id') // Get the id attribute.
console.log(id)
}
})
更新资料
将您现在拥有的模板替换为:
<template name="moviesTemplate">
<ul>
{{#each movies}}
<li>
<form data-id="{{title}}">
{{title}} <input type="submit" value="Delete" />
</form>
</li>
{{/each}}
</ul>
</template>
并使用之前在本文中编写的事件处理程序。
其实, this
事件处理程序内将是电影的背景下,这样的处理可以简单地:
Template.main.events({
'submit form': function(event, template){
event.preventDefault() // Don't submit it!
var id = this.title // Get the title through the context.
console.log(id)
}
})
因此无需在表单上使用data-id
属性。
不幸; 这不是那么简单。
起点将类似于此答案,但是您可能需要处理在元素上按“ Enter”键之类的事情
Template.moviesTemplate.events = {
'click input[type=submit]': function(e, tmpl){
tmpl.find('input[type=submit]').data('clicked',false);
$(e.currentTarget).data('clicked',true);
},
'submit': function (e, tmpl) {
e.preventDefault();
var theId = tmpl.find('input[type=submit]').filter(function(i,ele){
return $(ele).data('clicked');
}).get(0).attr('id');
}
}
您可以创建一个提交表单事件,然后有条件地检查事件目标字段。 根据要插入的集合调用适当的Meteor方法。
Template.detailsViewTemplate.events({
'submit form': function(ev){
ev.preventDefault();
var detail_input_field = template.$('#detail_entry');
var message_input_field = template.$('#message_entry');
if(detail_input_field != undefined){
var detailFormData = {
detail: $(ev.target).find('[name = detail]').val(),
parentId: $(ev.target).find('[name = parentId]').val(),
checkboxStatus: ''
}
Meteor.call('addDetail', detailFormData);
$('.form-group').children().val('');
} else if(message_input_field != undefined){
var newMessageData = {
listId: this.params_id,
message: $(ev.target).find('[name = message]').val()
}
Meteor.call('addMessage', newMessageData);
$('.form-group').children().val('');
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.