[英]Preview with meteor-autoform
I use meteor-autoform
with 我用meteor-autoform
{{> quickForm collection="Pages" id="insertPageForm" type="insert"}}
but I also want a box below the form with a preview area just like here on SO. 但我也想在表格下方有一个带有预览区域的框,就像这里的SO一样。
I just don't know how to bind a keyup trigger to the autoform field. 我只是不知道如何将keyup触发器绑定到autoform字段。
With a plain helper I could have html: 有了一个简单的帮手,我可以使用html:
<textarea class="text"></textarea>
<div class="preview"></div>
and js: 和js:
"change .text": function (e) {
$(".preview").text($(e.target).text());
}
or something like that. 或类似的东西。
If you to customize form using autoform then you have to use afQuickField ( doc ). 如果要使用自动表单自定义表单,则必须使用afQuickField ( doc )。
I tried with below code and I think this what you want. 我尝试使用下面的代码,我认为这是您想要的。
common/schema.js 通用/ schema.js
Pages = new Mongo.Collection("pages");
Pages.attachSchema(new SimpleSchema({
text : {
type: String,
label: "Text",
optional : true,
max: 1000,
autoform: {
rows: 2
}
}
}));
.html html的
<template name="stest">
{{#autoForm id="insertPageForm" collection="Pages" type='insert'}}
{{> afQuickField name='text'}}
<div class="preview"></div>
<div>
<button type="submit">Submit</button>
</div>
{{/autoForm}}
</template>
.js .js文件
Template.stest.events({
"keyup textarea[name=text]": function (e, t) {
t.$(".preview").text($(e.target).val());
}
});
Hope this help you. 希望这对您有所帮助。 Cheers! 干杯!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.