使用select绑定进行的Knockout验证不会添加ErrorElement.css

时间:2013-06-15 13:45:37

标签: javascript html knockout.js knockout-validation

我正在使用淘汰赛,并希望用户在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类。 任何人都可以告诉为什么这不起作用? 附:它适用于其他输入标签。

1 个答案:

答案 0 :(得分:5)

我在一个没有应用错误类的更复杂的模型上遇到过相同的问题,在这种情况下我创建了一个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());