带有选择绑定的淘汰赛验证不添加 ErrorElement.css答案

【问题标题】：Knockout validation with select binding not add ErrorElement.css带有选择绑定的淘汰赛验证不添加 ErrorElement.css
【发布时间】：2013-06-12 00:53:19
【问题描述】：

我正在使用淘汰赛并希望用户在 html 选择标记中选择一项。默认选择空值

<select required>
            <option value="">--Select something</option>
            <option value="True">True</option>
            <option value="False">False</option>

而viewModel包含：

self.sampleBooleanValue.extend({required : true});

我希望以下绑定会有所帮助

<select data-bind="value: sampleBooleanValue" required>

 ....
</select>

验证有效，但未将 css 类添加到选择标记。谁能告诉为什么这不起作用？附言它适用于另一个输入标签。

【问题讨论】：

您是否确认该类未添加到选择列表 DOM 元素中？还是您只是因为没有显示 css 视觉效果而假设它没有显示？
我验证它只添加了没有类名的空类属性（例如：
你能发布你的ko.validation.init( /* options object */ );调用来配置添加类名吗？
您确定标记中没有任何错误吗？你能发一个小提琴吗？

标签： javascript html knockout.js knockout-validation

【解决方案1】：

我在一个未应用错误类的更复杂的模型上遇到了同样的情况，在这种情况下，我创建了一个 selectedItemNotCaption 验证器，并且在 required: true 没有的地方工作（我相信它可能与标记上的一个错误，我没有关闭，但这确实可以让我进一步调查）。

使用fiddle here 试用下面的自定义验证器。

model = function () {
var self = this;
self.optionsAvailable = ['one', 'two'];

self.selectedOptionWithRequired = ko.observable().extend({
    required: true
});

self.selectedOption = ko.observable().extend({
    selectedItemNotCaption: true
});

self.submit = function () {
    console.log("checking for errors...");
    self.errors.showAllMessages();
};

self.errors = ko.validation.group(self);
};

ko.validation.configure({
insertMessages: false,
decorateElement: true,
errorElementClass: 'error'
});

ko.validation.rules['selectedItemNotCaption'] = {
validator: function (val) {
    console.log("in validator..." + val);
    return (typeof val != "undefined");
},
message: 'Please select an option'
};

ko.validation.registerExtenders();

ko.applyBindings(new model());

【讨论】：