knockout.js KnockoutJS:使用下拉列表验证多行时出现问题

mgdq6dx1  于 2022-11-10  发布在  其他
关注(0)|答案(1)|浏览(175)

因此,我尝试在单击按钮时验证两个下拉列表。当下拉列表第一次启动时,它们的初始值为undefined,因为没有选择任何内容。这正是我想要的。但是,当我在添加另一行之前单击添加按钮验证下拉列表时,验证从未发生。

JS

ko.validation.init({
    insertMessages: false,
    errorMessageClass: "ErrorLine"
  });
  ko.validation.rules['bothUndefined'] = {
    getValue: function (o) {
      return (typeof o === 'function' ? o() : o);
    },
    validator: function (val, params) {
      var self = this;

      var anyOne = ko.utils.arrayForEach(params, function (param) {
        if (typeof param === "function") {
            return typeof param() === "undefined";
          } else {
            return (typeof param === "undefined");
          }
        });

      return (typeof anyOne !== "undefined");
    },
    message: 'Please select one change.'
  };
  ko.validation.registerExtenders();

function BookPossessionTransferVM() {
    var self = this;
.
.
.
    self.PossessionChanges  = ko.observableArray([]);
    self.PossessionChangesErrors  =  ko.validation.group(self.PossessionChanges(), { deep: true, live: true });
    self.PossessionChanges.push(new PossessionChangeVM(self.PossessionChanges().length +1))
.
.
.
self.addPossessionChange = function () {
      if (self.PossessionChanges().length < 1) {
        self.PossessionChanges.push(new PossessionChangesVM(self.PossessionChanges().length + 1,
          self.AllFrom()));
      } else {
        self.PossessionChangesErrors.showAllMessages();
      }
    }
}

 function PossessionChangeVM(possessionChangeId) {
    var self = this;

    self.possessionChangeId = ko.observable(possessionChangeId);
    self.SelectedFrom =  ko.validatedObservable();
    self.SelectedTo =  ko.validatedObservable();
self.IsValidRow = ko.pureComputed(function() {
      return typeof self.SelectedFrom !== "undefined" && typeof self.SelectedTo !== "undefined";
    }).extend({
      bothUndefined: {
        params: [self.SelectedFrom, self.SelectedTo]
      }
    });

    self.ChangeType = ko.pureComputed(function() {
      if (self.SelectedFrom() !== undefined && self.SelectedTo() !== undefined) {
        return 'Update';
      } else if (self.SelectedFrom() === undefined && self.SelectedTo() === undefined) {
          return '';
      } else if (self.SelectedFrom() === undefined) {
        return 'Add';
      } else if (self.SelectedTo() === undefined) {
        return 'Remove';
      } else { return ''; }
    });
  }

在我点击添加按钮后,我期待PossessionChangesErrors有一个问题,因为它应该加载未定义的选项。但我什么也没有得到。再次感谢您的帮助!

**EDIT:**现在我有验证工作,但我不能清除验证创建一个新的行,一旦其中一个下拉唐斯已被选中。这里是小提琴:https://jsfiddle.net/p6x1nqm5/18/

gxwragnw

gxwragnw1#

结果我只是没有正确的逻辑来进行验证。下面是新的修改。https://jsfiddle.net/zw80kh2n/2/
IsValidRow已成为

self.IsValidRow = ko.pureComputed(function() {
      return (!(self.SelectedFrom() === undefined && self.SelectedTo() === undefined))
    }).extend({      bothUndefined: {}
    });

验证变成了

ko.validation.rules['bothUndefined'] = {
    getValue: function (o) {
      return (typeof o === 'function' ? o() : o);
    },
    validator: function (val) {
      return val;
    },
    message: 'Please select one change.'
  };
  ko.validation.registerExtenders();

相关问题