如何用Meteor中的集合中的值填充autoForm选择?

时间:2015-10-30 12:39:17

标签: javascript meteor meteor-autoform meteor-collection2 simple-schema

我刚刚为Meteor找到了这个非常棒的autoForm包,我想和select2一起使用它。

我的目标是使用autoForm轻松地为我的一个集合创建输入表单。障碍是:如何使用其他集合中的字段填充它,如何进行多选?

在我的lib / collections中,我声明了一个Meteor集合:

Clients = new Mongo.Collection('clients');
Clients.attachSchema(new SimpleSchema({
    clientName: {
        type: String,
        label: "Mandator Name",
        max: 200
    }
}));

现在我没有获得有关autoForm的文档。在大气页面(https://atmospherejs.com/aldeed/autoform)上,如果我没有错,我应该使用这样的东西:

{{#autoForm collection="Clients" id="insertClientForm" type="insert"}}
    {{> afFieldInput name="clientName" options=options}}
{{/autoForm}}

然后像这样写一些JS:

Template.registerHelper({
    options: function() {
        return Clients.find({}, {fields: {clientName: 1}});
    }
});

模板呈现正常,就像我可以看到输入框一样。但它不是多选,它根本不允许我选择任何值。

关于问题所在的任何想法?

加分问题:如何在autoForm生成的选择输入上使用select2? 编辑:使用aldeed:autoform-select2来使用select2。

2 个答案:

答案 0 :(得分:1)

我使用

测试了Meteor的这个解决方案

aldeed:collection2 aldeed:自动窗体 natestrauser:选择2 aldeed:autoform-select2

假设您有一个表单,其中包含有关用户的个人资料信息,其中一个字段是“职业”(如他们的工作等),您希望他们从列表中选择职业。

1)发布要用于“选择”选项的集合。

在服务器上

Meteor.publish('occupations', function () {
  return Occupations.find();
});

2)订阅客户端上的集合

在客户端

Meteor.subscribe('occupations');

3)为表单模板创建一个帮助器

Template.CreateUser.helpers({
  listOccupations: function () {
    return Occupations.find({}).fetch();
  },
});

4)然后最后在autoForm字段的options参数中引用该帮助器 - 在本例中我使用了afQuickField

{{> afQuickField name='occupations' multiple=true tags=true options=listOccupations}}

5)并确保您的架构设置正确以使用Select2

occupations: {
    type: [String],
    optional:true,
    label: 'Occupation',
    autoform:{
      type:"select2",
      placeholder: 'Comma spaced list of occupations',
    }
  },

答案 1 :(得分:0)

您需要将集合映射到标签和值; label是客户端将看到的内容,value是将在提交时保存的内容。

https://github.com/aldeed/meteor-autoform#use-a-helper

Template.registerHelper({
    options: function() {
        return Clients.find({}, {fields: {clientName: 1}}).map(function (c){
      return {label: c.clientName, value: c._id};;
    }
});

如果您想要多选,则需要将架构键设为[String]而不是String