knockout.validation validatedObservable always returns false - asp.net-mvc-3

Question

So I am trying to set up ko validation for my partial view. I pretty much implemented the same deisgn as another partial view that has the ko validation. It works perfectly there, but with this partial view it doesn't work.
This is what I have in 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"));
This is what I have in the HTML:
<input data-bind="value: FirstName, validationElement: FirstName" class="input" type="text" />
<input data-bind="value: LastName, validationElement: LastName" class="input" type="text" />
Etc.
NOTE: This is line of code that always returns FALSE.
addReferenceValidationGroup.isValid()
Also this line doesn't add 'error' class to any of the controls. So it doesn't get highligted red either:
addReferenceValidationGroup.errors.showAllMessages();
PLEASE PLEASE HELP!
EDIT: Here is the Model properties:
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;
}

Answer 1

I think the problem is with this statements:
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"));
Somewhere along with JsonConvert.SerializeObject and trying to mapping two viewmodels together.