knockout complex model example

by amitava82

HTML

<script src="https://raw.github.com/SteveSanderson/knockout/master/build/output/knockout-latest.debug.js"></script>

JavaScript

$(document).ready(function() {
    ko.applyBindings(new viewModel());
    var data = createModel.ActionDefinitions[1];


    var test = new ActionDefinition(data);

    console.log(ko.toJS(test))
});

function RuleCategory() {
    var self = this;

}

function ActionDefinition(data) {
    var self = this;
    self.Id = data.Id;
    self.Name = data.Name;
    self.DisplayName = data.DisplayName;
    self.ValueDisplayType = data.ValueDisplayType;
    self.ActionDefinitionId = data.ActionDefinitionId;
    self.IsConditionQuery = data.IsConditionQuery;
    self.OperandList = ko.observableArray(ko.utils.arrayMap(data.OperandList || [], function(oprand) {
        return new OprandList(oprand);
    }));
}

function OprandList(data) {
    var self = this;
    self.OperandID = data.OperandID;
    self.ApplicableOperators = ko.observableArray(ko.utils.arrayMap(data.ApplicableOperators || [], function(operator) {
        return new ApplicableOperator(operator);
    }));

}

function ApplicableOperator(data) {
    var self = this;
    self.DisplayType = ko.observable(data.DisplayType);
    self.OperatorName = ko.observable(data.OperatorName);
}

function Rule(data) {
    var self = this;
    self.RuleDescription = ko.observable(data.RuleDescription);
    self.RuleConditionMatchType = ko.observable(data.RuleConditionMatchType);
    self.RuleConditionExpressions = ko.observableArray([]);
    self.RuleActions = ko.observableArray([]);
}

var viewModel = function() {
    var self = this;
    var storedData = createModel;
    self.ActionDefinitions = ko.observableArray([]);

}

var createModel = {
    "ForRSPID": 0,
    "Operands": null,
    "RuleCategory": {
        "RuleCategoryID": 1,
        "RuleCategoryName": "Auto assign radiologist",
        "ParentContextID": 1,
        "BooleanOperators": null,
        "Operands": [
            {
            "OperandID": 1,
            "OperandName": "Order Modality",
            "ApplicableOperators": [
                {
              ...