Knockout Custom Mapping2

Demonstrates how to add computed observable to observable arrays generated by the kn.mapping plugin

by bradleytrager

HTML

<script src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
<textarea data-bind="text:ko.toJSON(questions)"
    rows="20" cols="60"
></textarea><br/>
<ul data-bind="foreach:questions()"><li><span data-bind="text:ValidationType"></span></li></ul>

JavaScript

var data = [
   {
        "QuestionId": 1,
        "QuestionText": "Email",
        "QuestionType": "2",
        "QuestionMultipleOptions": [],
        //"ValidationType": " ", 
        "Required":false,
        "SingleResponse":"",
        "MultipleResponse": []
    },
                     {
        "QuestionId": 1,
        "QuestionText": "Email",
        "QuestionType": "2",
        "QuestionMultipleOptions": [],
        "ValidationType": "email",
        "Required":false,
        "SingleResponse":"",
        "MultipleResponse": []
    }
];
function Question(data) {
    var self = this;
    self.QuestionText = ko.observable(data.QuestionText);
    self.QuestionType = ko.observable(data.QuestionType);
    self.QuestionMultipleOptions = ko.observableArray(data.QuestionMultipleOptions);
    self.Required = ko.observable(data.Required);
    self.ValidationType = ko.observable(data.ValidationType)
    
    //response
    self.SingleResponse = ko.observable(data.SingleResponse);
    self.MultipleResponse = ko.observableArray(data.MultipleResponse);
}
var mapping = {
    create: function (options) {
        return new Question(options.data);
    }
};
function viewModel() {
    var self = this;
    self.questions = ko.mapping.fromJS(data, mapping);
}

var vm = new viewModel();

ko.applyBindings(vm);