knockout.validation validatedObservable始终返回false

时间:2013-01-17 15:26:06

标签: asp.net-mvc-3 knockout.js knockout-validation

所以我试图为我的局部视图设置ko验证。我几乎实现了与另一个具有ko验证的局部视图相同的设计。它在那里工作得很好,但是这个局部视图不起作用。

这就是我在javascript中所拥有的:

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

function Reference(referenceId, id, firstName, lastName, title, email, company, phone) {
    this.ReferenceId = ko.observable(referenceId);
    this.Id = id;
    this.FirstName = firstName;
    this.LastName = lastName;
    this.Title = title;
    this.Company = company;
    this.Email = email;
    this.Phone = phone;
}

var viewModel = function () {
        var self = this;

        self.FirstName = ko.observable().extend({ required: true });
        self.LastName = ko.observable().extend({ required: true });
        self.Title = ko.observable();
        self.Email = ko.observable().extend({ required: true, email: true });
        self.Phone = ko.observable().extend({ required: true });
        self.Company = ko.observable().extend({ required: true });


        addReferenceValidationGroup = ko.validatedObservable({
            FirstName: self.FirstName,
            LastName: self.LastName,
            Phone: self.Phone,
            Email: self.Email,
            Company: self.Company
        });

        self.addReference = function () {

            if (!addReferenceValidationGroup.isValid()) {
                console.log(addReferenceValidationGroup.errors());
                addReferenceValidationGroup.errors.showAllMessages();
                return false;
            } else {
                var newReference = new Reference(0, this.CandidateId(), self.FirstName(), self.LastName(), self.Title(), self.Email(), self.Company(), self.Phone());
                console.log(newReference);
                $.ajax({
                    url: '@Url.Action("AddReference")',
                    type: "POST",
                    data: ko.toJSON(newReference),
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    success: function (result) {
                        newReference.ReferenceId(result.message); //Sets the InterviewId to the new one
                    },
                    error: function (result) {

                    }
                });
                this.References.push(newReference);

                self.FirstName('');
                self.LastName('');
                self.Title('');
                self.Email('');
                self.Phone('');
                self.Company('');

                self.FirstName.isModified(false);
                self.LastName.isModified(false);
                self.Email.isModified(false);
                self.Phone.isModified(false);
                self.Company.isModified(false);
            }
        };

        self.goNext = function () {
            $.ajax({
                url: '@Url.Action("JobDepartures")',
                type: "POST",
                data: ko.toJSON(this),
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (result) {
                    ko.removeNode(document.getElementById("referencesDiv"));
                    $("#dynamicData").html(result.message);
                }
            });
        };
    };
var jsonModel = '@Html.Raw(JsonConvert.SerializeObject(this.Model))';
var mvcModel = ko.mapping.fromJSON(jsonModel);

var myViewModel = new viewModel();
var g = ko.mapping.fromJS(myViewModel, mvcModel);

ko.applyBindings(g, document.getElementById("referencesDiv"));

这就是我在HTML中的内容:

<input data-bind="value: FirstName, validationElement: FirstName" class="input" type="text" />
<input data-bind="value: LastName, validationElement: LastName" class="input" type="text" />

注意:这是始终返回FALSE的代码行。

addReferenceValidationGroup.isValid()

此行也不会为任何控件添加“错误”类。所以它也没有得到高亮的红色:

addReferenceValidationGroup.errors.showAllMessages();

请帮助!

编辑:这是模型属性:

public int CandidateId { get; set; }    
public string FirstName { get; set; }    
public string LastName { get; set; }    
public string Title { get; set; }    
public string Email { get; set; }   
public string Phone { get; set; }   
public string Company { get; set; }    
public List<ReferenceViewModel> References
{
   get;
   set;
}

1 个答案:

答案 0 :(得分:0)

我认为问题在于这些陈述:

var jsonModel = '@Html.Raw(JsonConvert.SerializeObject(this.Model))';
var mvcModel = ko.mapping.fromJSON(jsonModel);

var myViewModel = new viewModel();
var g = ko.mapping.fromJS(myViewModel, mvcModel);

ko.applyBindings(g, document.getElementById("referencesDiv"));

VS

var viewModel = @Html.Raw(Json.Encode(Model));
ko.applyBindings(viewModel, document.getElementById("referencesDiv"));

与JsonConvert.SerializeObject一起尝试将两个视图模型映射到一起。