Meteor Autoform - 防止字段更新

Question

在我的自动表单中，一个字段的值是另外两个输入字段的差值。不允许用户更新。不幸的是，目前无法在表单中将单个字段设置为只读。所以我的方法是创建一个 autoValue 和一个自定义验证来防止更新

到目前为止我的代码：

        'SiteA.Settings.RXSignalODU1difference': {
            type: Number,
            label: "RX Signal [dBm] ODU1 difference (without ATPC +/- 3dbm)",
            decimal: true,
            autoform: {
              type: "number"
            },
            autoValue: function() {
                var ODU1gemessen = this.field("SiteA.Settings.RXSignalODU1");
                var ODU1planned = this.field("SiteA.Settings.RXSignalODU1planned");
                if (ODU1gemessen.isSet || ODU1planned.isSet) {
                    return ODU1gemessen.value - ODU1planned.value;
                }
            },
            custom: function() {
                var ODU1gemessen = this.field("SiteA.Settings.RXSignalODU1");
                var ODU1planned = this.field("SiteA.Settings.RXSignalODU1planned");
                var dif = ODU1gemessen.value - ODU1planned.value;
                if (this.value !== dif) {
                    return "noUpdateAllowed";
                }
            }
        },

我的Simple.Schema留言：

SimpleSchema.messages({noUpdateAllowed: "Can't be updated"});

很遗憾，没有弹出消息。

Answer 1

编辑

此方法将在您的表单中创建一个禁用的输入框，该输入框将在用户键入时自动显示其他两个输入字段之间的差异。

首先，我们为计算中使用的值定义会话变量，并将它们初始化为未定义。

Template.xyz.onRendered({
  Session.set("ODU1gemessen", undefined);
  Session.set("ODU1planned", undefined);
});

然后我们定义两个事件，当用户输入时会自动更新这些会话变量。

Template.xyz.events({
  'keyup #RXSignalODU1' : function (event) {
    var value = $(event.target).val();
    Session.set("ODU1gemessen", value);
  },
  'keyup #RXSignalODU1planned' : function (event) {
    var value = $(event.target).val();
    Session.set("ODU1planned", value);
  }

});

然后我们定义一个helper来计算差值。

Template.xyz.helpers({
  RXSignalODU1difference : function () {
    var ODU1gemessen = Session.get("ODU1gemessen");
    var ODU1planned = Session.get("ODU1planned"); 

    if (!!ODU1gemessen || !!ODU1planned) {
      return ODU1gemessen - ODU1planned;
    }
  }
});

我的 HTML 标记如下所示。请注意，为了仍然控制表单的顺序，我使用带有一系列 {{> afQuickfields }} 的 {{#autoform}} 而不是使用 {{> quickForm}}。

为了显示计算出的差异，我创建了一个带有禁用文本框的自定义 div。

<template name="xyz">
  {{#autoForm collection="yourCollection" id="yourId" type="insert"}}
    <fieldset>
      <legend>Enter legend text</legend>
      {{> afQuickField name="SiteA.Settings.RXSignalODU1" id="RXSignalODU1"}}
      {{> afQuickField name="SiteA.Settings.RXSignalODU1planned" id="RXSignalODU1planned"}}
      <div class="form-group">
          <label class="control-label">RXSignalODU1difference</label>
          <input class="form-control" type="text" name="RXSignalODU1difference" disabled value="{{RXSignalODU1difference}}">
          <span class="help-block"></span>
        </div>
    </fieldset>
    <button class="btn btn-primary" type="submit">Insert</button>
  {{/autoForm}}
</template>

原答案-不推荐

如果您将表单生成为快速表单，您可以执行类似

的操作

{{>quickForm collection='yourCollection' omitFields='SiteA.Settings.RXSignalODU1difference'}}

这会将此字段从表单中删除，因此用户将无法更新它。

如果您仍想在用户输入其他两个值时将值与表单一起显示在某处，您可以在客户端 js 中定义一个帮助程序

类似于

Template.yourFormPage.helpers({
    diff: function () {
        var ODU1gemessen = $('[name=SiteA.Settings.RXSignalODU1]').val();
        var ODU1planned = $('[name=SiteA.Settings.RXSignalODU1planned]').val();
        if (!!ODU1gemessen || !!ODU1planned) {
            return ODU1gemessen - ODU1planned;
        }
     }
});

您需要仔细检查字段名称在 DOM 中的呈现方式。 Autoform 使用架构中的字段名称分配名称属性，但我不知道它如何处理嵌套键......（即它是否命名元素 'SiteA.Settings.RXSignalODU1' 或只是 'RXSignalODU1' ）

然后只需将 html 中某处的值显示为 :

{{diff}}

Meteor Autoform - 防止字段更新

Meteor Autoform - Prevent Field from Update

meteor

meteor-autoform