在Meteor中使用autoform创建简单的输入字段

Right now I have multiple filters

现在我有多个过滤器

<template name="filter1">
  {{> selectFilter fieldName=fieldName options=options}}
</template>

<template name="filter2">
  {{> selectFilter fieldName=fieldName options=options}}
</template>

<template name="filter3">
  {{> selectFilter fieldName=fieldName options=options}}
</template>

<template name="filter4">
  {{> selectFilter fieldName=fieldName options=options}}
</template>

<template name="selectFilter">
  <select name="{{fieldName}}" class="form-control">
    <option value="">Any</option>
    {{#each options}}
      <option value="{{value}}" selected="{{#if sessionEquals ../fieldName value}}selected{{/if}}">{{label}}</option>
    {{/each}}
  </select>
</template>

which I populate with

这是我填充的

Template.filter1.helpers( {
  fieldName: 'fieldName',
  options: getOptions
} );

Template.selectFilter.helpers( {
  sessionEquals: function ( key, value ) {
    return Session.equals( key, value );
  }
} );

Template.selectFilter.events( {
  'change select': function ( event ) {
    var $el = $( event.currentTarget );
    var variableName = $el.attr( 'name' );
    var value = $el.val();

    if ( isInt( value ) ) {
      value = parseInt( value, 10 );
    }

    Session.set( variableName, value );
  },
} );

With collection2, I have set options with:

使用collection2,我设置了以下选项:

field1: {
  type: Number,
  optional: true,
  autoform: {
    options: getOptionsForField1,
  },
},

Is it possible to use autoform and collection2 to create a simple select element already populated with options without creating the html myself and populate the template with options?

是否可以使用autoform和collection2来创建一个已经填充了选项的简单select元素,而无需自己创建html并使用选项填充模板?

I guess I can do something like {{> quickField name=fieldName }}, but I don't know how to tell from which schema it should look, and how to react on select change.

我想我可以做一些像{{> quickField name = fieldName}}这样的事情,但是我不知道如何判断它应该看哪个模式,以及如何对选择更改做出反应。

I just think it seems stupid of me to both specify the options in my schema and also populate the options to the template. This should be done automatically.

我只是认为在我的架构中指定选项并将选项填充到模板似乎是愚蠢的。这应该自动完成。

1 个解决方案

#1

Your AutoForm:

{{#autoForm collection="Collection" id=insertCollection type="insert"}}
    {{> afQuickField name='field1'}}
{{/autoForm}}

Your SimpleSchema:

Collection = new Mongo.Collection('collection');
Collection.attachSchema(new SimpleSchema({
    field1: {
        type: Number,
        optional: true,
        autoform: {
            options: function() {
                return [1,2,3,4,5,6,7,8,9];
            },
            type: "select"
        }
    }
});