3

I just found this awesome autoForm package for Meteor and I want to use it together with select2.

My goal is to use the autoForm to easily create an input form for one of my collections. The obstacle is: how do I populate it with fields from another collection and how do I make it multi-select?

Inside my lib/collections I declare a Meteor collection:

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

Now I don't get the documentation on autoForm. On the atmospherejs page (https://atmospherejs.com/aldeed/autoform) I am supposed to use something like this if I am not wrong:

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

And then write some JS like this:

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

The template is rendered alright, as in I can see an input box. However it is not a multi-select and it does not allow me to select any values at all.

Any ideas on where the issue is?

Bonus question: How do I use select2 on autoForm generated select inputs? EDIT: Use aldeed:autoform-select2 to use select2.

4

2 回答 2

2

我已经使用 Meteor 测试了这个解决方案

aldeed:collection2 aldeed:autoform natestrauser:select2 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 字段的选项参数中引用该助手 - 在这种情况下，我使用了 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',
    }
  },
于 2016-05-25T23:00:15.283 回答
1

您需要将您的集合映射到一个标签和一个值；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

于 2015-10-30T13:37:06.450 回答