Knockoutのオブザーバブルを使用した ビューモデルのデータを、サーバーサイドに渡したい場合、JSON形式など適切な形式に変換する必要があります。今回はビューモデルをプレーンなJavascriptオブジェクトやJSON形式に変換する toJS(), toJSON() メソッドを使うサンプルの覚書を記載します。
プレーンなJavascriptを使用している場合は jQueryの serialize を使って フォームデータをシリアライズしたり、 JSON.stringify を使ってJavascriptオブジェクトをJSON形式に変換して必要なデータ形式に変換できます
動作確認は KnockoutJS 3.3 を使用しています。
サンプルコード自体は簡単です。KnockoutJSを使用すると ビューモデル と ビューを分離できることからビューは定義せずに単純に変換するコードを記載しています。toJS()はプレーンなJavascriptオブジェクトに変換します。 toJSON() はJSON形式に変換します。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="/Scripts/knockout-3.3.0.js"></script>
<script type="text/javascript">
function viewModel() {
var self = this;
self.text1 = 'Sample Text1';
self.text2 = ko.observable('Sample Text2');
self.check1 = ko.observable(true);
self.check2 = false;
self.array1 = ["Tokyo", "Aichi"];
self.array2 = ko.observableArray(["male", "female"]);
}
var vm = new viewModel();
console.log("プレーンなJavascriptオブジェクトに変換");
console.log(ko.toJS(vm));
console.log(ko.toJS(vm).text1);
console.log(ko.toJS(vm).text2);
console.log("JSON形式に変換");
console.log(ko.toJSON(vm));
</script>
</body>
</html>
さんのコメント: さんのコメント: