Knockout.js验证始终返回true/errors.length=0问题求助

看起来你在使用Knockout.js验证插件时踩了几个常见的坑，我来帮你一步步修正：

问题核心分析 #

你的代码里有几个关键错误导致验证逻辑失效：

1. 语法错误：UserModel function { 缺少变量声明和等号，正确写法应该是 var UserModel = function() {
2. 对象引用错误：你直接给User构造函数添加errors属性，但验证组必须绑定到User的实例上，而不是构造函数本身
3. 绑定目标错误：你绑定的对象存在大小写错误，且没有把验证逻辑和数据实例正确关联

修正后的完整代码 #

// 定义带验证规则的User构造函数
var User = function () {
    this.UserId = ko.observable();
    this.Fullname = ko.observable().extend({ required: true });
    this.Username = ko.observable().extend({ required: true });
    this.StartedDate = ko.observable().extend({ required: true });
    this.Email = ko.observable().extend({ required: true });
    this.Facebook = ko.observable().extend({ required: true });
    this.Address = ko.observable().extend({ required: true });
    this.MobileNumber = ko.observable().extend({ required: true });
    this.Birthdate = ko.observable().extend({ required: true });
    this.PositionId = ko.observable().extend({ required: true });

    // 给当前User实例绑定验证组，每个实例都有独立的错误集合
    this.errors = ko.validation.group(this);
};

// 修正UserModel的语法，处理保存逻辑
var UserModel = function () {
    var self = this;
    
    // 创建User的实例，这是我们要验证的表单数据载体
    self.currentUser = new User();

    self.Save = function () {
        // 检查当前实例的错误，而非构造函数的错误
        if (self.currentUser.errors().length === 0) {
            alert('表单验证通过！');
            // 这里可以添加表单提交的逻辑
        } else {
            alert('Please check your submission.');
            // 显示所有必填字段的错误提示
            self.currentUser.errors.showAllMessages();
        }
    };
};

// 将ViewModel绑定到页面
ko.applyBindings(new UserModel());

关键修改说明 #

• 把ko.validation.group(this)移到User构造函数内部，让每个User实例都拥有自己的errors属性，确保验证逻辑和数据实例一一对应
• 修正UserModel的语法错误，创建currentUser实例来承载表单数据，避免直接操作构造函数
• 在Save函数中，针对currentUser实例的errors进行检查，保证验证的是当前表单数据

补充HTML绑定示例 #

确保你的页面元素和ViewModel正确绑定，比如：

<div>
    <label>Fullname:</label>
    <input type="text" data-bind="value: currentUser.Fullname" />
    <span data-bind="validationMessage: currentUser.Fullname" style="color:red;"></span>
</div>
<!-- 其他字段类似绑定 -->
<button data-bind="click: Save">Save</button>

这样点击保存按钮时，就能正确触发必填字段的验证，并显示对应的错误提示了。

内容的提问来源于stack exchange，提问作者Jasey Meonada