所以我试图为我的局部视图设置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;
}
答案 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"));
var viewModel = @Html.Raw(Json.Encode(Model));
ko.applyBindings(viewModel, document.getElementById("referencesDiv"));
与JsonConvert.SerializeObject一起尝试将两个视图模型映射到一起。