Question

I want to save my ViewModel to my SQL server. The standard knockout ko.toJSON(viewModel) keeps giving me an undefined error, so after some digging i found this Question, but still keeps giving me undefined.

Here is the code for my viewmodel, this is just a currency conversion table that gets the Conversion Rate between 2 currencies.

   //ko Event Handler for datepicker.js
    ko.bindingHandlers.datepicker = {
        init: function (element, valueAccessor, allBindingsAccessor) {
            //initialize datepicker with some optional options
            var options = allBindingsAccessor().datepickerOptions || {};
            $(element).datepicker(options).on("changeDate", function (ev) {
                var observable = valueAccessor();
                observable(ev.date);
            });
        },
        update: function (element, valueAccessor) {
            var value = ko.utils.unwrapObservable(valueAccessor());
            $(element).datepicker("setValue", value);
        }
    };


    //Currency Model Definition
    var currency = function (data) {
        var self = this;
        self.DateCreated = ko.observable(formatJsonDate(data.DateCreated));
        self.CurrencyFrom = ko.observable(data.CurrencyFrom);
        self.CurrencyTo = ko.observable(data.CurrencyTo);
        self.ConversionRate = ko.observable(data.ConversionRate);

        //Yhoo Finance API
        ko.computed(function () {
            var from = self.CurrencyFrom(),
                 to = self.CurrencyTo();


            if (!from || !to) {
                self.ConversionRate("N/A");
                return;
            }

            getRate(from, to).done(function (YahooData) {
                console.log("got yahoo data for [" + from + "," + to + "]: ", YahooData);
                self.ConversionRate(YahooData.query.results.row.rate);
            });
        });
    }

    var NewDate = new Date().getFullYear() + '-' + ("0" + (new Date().getMonth() + 1)).slice(-2) + '-' + new Date().getDate();


    var CurrencyModel = function (Currencies) {
        var self = this;
        self.Currencies = ko.observableArray(Currencies);

        self.AddCurrency = function () {
            self.Currencies.push({
                DateCreated: NewDate,
                CurrencyFrom: "",
                CurrencyTo: "",
                ConversionRate: ""
            });
        };

        self.RemoveCurrency = function (Currency) {
            self.Currencies.remove(Currency);
        };

        self.Save = function () {

            $.ajax({
                url: "#",
                contentType: 'application/json',
                data: ko.mapping.toJSON(CurrencyModel),
                type: "POST",
                dataType: 'json',
                success: function (data) {
                    //I get undefined....
                    alert(ko.mapping.toJSON(CurrencyModel));
                },
                error: function (data) { alert("error" + data); }
            });
        }

        $.ajax({
            url: "CurrencyConfiguration.aspx/GetConfiguredCurrencies",
            data: '{}',
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataType: "JSON",
            timeout: 10000,
            success: function (Result) {
                //                    callback(Result);
                var MappedCurrencies =
              $.map(Result.d,
             function (item) {
                 getRate(item.CurrencyFrom, item.CurrencyTo);
                 return new currency(item);
             }
       );
                self.Currencies(MappedCurrencies);

            },
            error: function (xhr, status) {
                alert(status + " - " + xhr.responseText);
            }
        });

    };

    function formatJsonDate(jsonDate) {
        var FormatDate = new Date(parseInt(jsonDate.substr(6)));
        var Output = FormatDate.getFullYear() + '-' + ("0" + (FormatDate.getMonth() + 1)).slice(-2) + '-' + FormatDate.getDate();
        return (Output);
    };

    function getRate(from, to) {
        return $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20rate%2Cname%20from%20csv%20where%20url%3D'http%3A%2F%2Fdownload.finance.yahoo.com%2Fd%2Fquotes%3Fs%3D" + from + to + "%253DX%26f%3Dl1n'%20and%20columns%3D'rate%2Cname'&format=json&callback=?");
    }

        function callback(data) {
        if (viewModel) {
            // model was initialized, update it
            ko.mapping.fromJS(data, viewModel);
        } else {
            // or initialize and bind
            viewModel = ko.mapping.fromJS(data);
            ko.applyBindings(viewModel);
        }
    }

    $('#Date').datepicker();

    $(document).ready(function () {
        var VM = new CurrencyModel();
        ko.applyBindings(VM);
    })

Answer 1

data: ko.mapping.toJSON(CurrencyModel)

You are trying to JSONify the definition not the actual instance