当将值绑定(bind)到下拉列表并使用 knockout validation 时,错误消息似乎总是显示,即使我的 knockout validation 设置为 messagesOnModified: true
。
HTML
<input type="text" data-bind="value: Name" />
<br />
<select data-bind="value: State">
<option value="">Select a state...</option>
<option value="NY">New York</option>
<option value="NJ">New Jersey</option>
</select>
JS
var ViewModel = function () {
var self = this;
self.Name = ko.observable().extend({
required: { message: "You must enter a name." }
});
self.State = ko.observable().extend({
required: { message: "You must select a state." }
});
self.Errors = ko.validation.group(self);
}
ko.validation.configure({
messagesOnModified: true,
insertMessages: true
});
ko.applyBindings(new ViewModel(), document.body);
用jsfiddle显示文本框和下拉列表的区别:http://jsfiddle.net/f7v4m/
文本框显示了正确的行为,其中错误消息只会在值被修改后显示。
为什么显示下拉列表的错误消息?
最佳答案
要删除“初始”验证消息,您需要使用空字符串初始化您的 State
属性:
self.State = ko.observable("").extend({
required: { message: "You must select a state." }
});
演示 JSFiddle .
您需要这样做,因为在编写 ko.observable()
时,它将使用 undefined
进行初始化,但是当 knockout 评估 value
绑定(bind)时它将 State
设置为当前选择的空选项值,这是一个空字符串。
但是 undefined
不等于空字符串,它会使您的属性“变脏”并触发验证消息,因为验证插件认为您的属性已被修改。
关于javascript - 下拉列表上的 knockout validation 始终显示错误消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23434657/