我正在进行概念证明演示,我需要编写一个表单视图,这样我就可以将项目添加到我的内容数组中。我在外部加载此视图,然后使用Handler编译它。我添加了一个提交方法并使用了{{action}}绑定,但每次单击提交按钮时它都会重新加载页面。我错过了什么?
//模板
<form>
<div>
<label for="client">Client Name</label>
<input type="text" id="client" placeholder="Add client name" />
</div>
<div>
<button {{action "addClientSubmit" target="PM.addClientView"}}>Add Client</button>
</div>
<div>
<a href="#" {{action "closeWindow" target="PM"}}>close</a>
</div>
</form>
//视图代码
PM.addClientView = Ember.View.create({
templateName: 'addClient',
classNames: 'overlay',
addClientSubmit: function(e){
e.preventDefault();
console.log('submitting add client form');
console.log(a,b,c)
}
});
//最后这是我如何将它添加到页面
PM = Ember.Application.create({
loadView: function(view){
$.ajax({
url: viewPath,
success: function (template) {
if (!Ember.TEMPLATES[templateName]) {
Ember.TEMPLATES[templateName] = Ember.Handlebars.compile(template);
};
PM[view + 'View'].appendTo('body');
}
});
}
});
其他一切都有效,但当我点击提交按钮时,页面会重新加载。我确定我要留下一些东西,但我无法弄清楚它是什么。
答案 0 :(得分:6)
您可能需要将type="button"
添加到按钮标记中。默认值为type="submit"
,将触发表单提交。
这是一个jsFiddle:http://jsfiddle.net/b2CTg/2/
答案 1 :(得分:1)
问题是创建PM.addClientView时模板不存在。
尝试将PM.addClientView = Ember.View.create({
更改为PM.addClientView = Ember.View.extend({
你的成功功能
PM [view +'View'] .create({template: Ember.Handlebars.compile(template)})。append();
这是一个小提琴:http://jsfiddle.net/7E5zt/