{"action":"created","issue":{"url":"https://api.github.com/repos/matreshkajs/matreshka/issues/24","labels_url":"https://api.github.com/repos/matreshkajs/matreshka/issues/24/labels{/name}","comments_url":"https://api.github.com/repos/matreshkajs/matreshka/issues/24/comments","events_url":"https://api.github.com/repos/matreshkajs/matreshka/issues/24/events","html_url":"https://github.com/matreshkajs/matreshka/issues/24","id":116555410,"number":24,"title":"Server side rendered data?","user":{"login":"kokujin","id":2885603,"avatar_url":"https://avatars.githubusercontent.com/u/2885603?v=3","gravatar_id":"","url":"https://api.github.com/users/kokujin","html_url":"https://github.com/kokujin","followers_url":"https://api.github.com/users/kokujin/followers","following_url":"https://api.github.com/users/kokujin/following{/other_user}","gists_url":"https://api.github.com/users/kokujin/gists{/gist_id}","starred_url":"https://api.github.com/users/kokujin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kokujin/subscriptions","organizations_url":"https://api.github.com/users/kokujin/orgs","repos_url":"https://api.github.com/users/kokujin/repos","events_url":"https://api.github.com/users/kokujin/events{/privacy}","received_events_url":"https://api.github.com/users/kokujin/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-11-12T14:10:53Z","updated_at":"2015-11-12T14:25:40Z","closed_at":"2015-11-12T14:25:40Z","body":"How can keep the initial state of a bound node till it is actively changed? Take the example of data that has been rendered in my templates from the Backend/ Server. \r\n\r\nUsing your example:\r\n\r\n`````\r\n<input type=\"text\" class=\"my-input\"><br>\r\n<span class=\"my-span\">Server side data</span> <----- This value disappears\r\n`````\r\n`````\r\nvar Application = Class({\r\n    'extends': Matreshka,\r\n    constructor: function () {\r\n\r\n        // bind the property x and the text field\r\n        this.bindNode('x', '.my-input');\r\n\r\n        // bind the property x and the \".my-output\" block\r\n        this.bindNode('x', '.my-span', {\r\n            setValue: function (v) {\r\n                this.innerHTML = v;\r\n            }\r\n        });\r\n\r\n        // if the property \"х\" has changed,\r\n        // inform about it in the console\r\n        this.on('change:x', function () {\r\n            console.log('x changed to ' + this.x);\r\n        });\r\n    }\r\n});\r\n\r\nvar app = new Application();\r\n````\r\nThe value rendered by the server in the spane is removed. It should stay till it is actively changed.\r\nThanks\r\n"},"comment":{"url":"https://api.github.com/repos/matreshkajs/matreshka/issues/comments/156115212","html_url":"https://github.com/matreshkajs/matreshka/issues/24#issuecomment-156115212","issue_url":"https://api.github.com/repos/matreshkajs/matreshka/issues/24","id":156115212,"user":{"login":"finom","id":1082083,"avatar_url":"https://avatars.githubusercontent.com/u/1082083?v=3","gravatar_id":"","url":"https://api.github.com/users/finom","html_url":"https://github.com/finom","followers_url":"https://api.github.com/users/finom/followers","following_url":"https://api.github.com/users/finom/following{/other_user}","gists_url":"https://api.github.com/users/finom/gists{/gist_id}","starred_url":"https://api.github.com/users/finom/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/finom/subscriptions","organizations_url":"https://api.github.com/users/finom/orgs","repos_url":"https://api.github.com/users/finom/repos","events_url":"https://api.github.com/users/finom/events{/privacy}","received_events_url":"https://api.github.com/users/finom/received_events","type":"User","site_admin":false},"created_at":"2015-11-12T14:25:40Z","updated_at":"2015-11-12T14:25:40Z","body":"@kokujin thanks for your activity. This place is used for issue/bug reporting. For general questions welcome to [the forum](http://matreshka.io/forum/).\r\n\r\nAnswering your question:\r\n```js\r\n // bind the property x and the \".my-output\" block\r\n        this.bindNode('x', '.my-span', {\r\n            setValue: function (v) {\r\n                this.innerHTML = v;\r\n            }\r\n        });\r\n```\r\nThis code doesn't know how to retrieve data from ``.my-span`` it knows only how to set data.\r\n\r\nYou need to define ``getValue`` property for the binder:\r\n```js\r\n // bind the property x and the \".my-output\" block\r\n        this.bindNode('x', '.my-span', {\r\n            setValue: function (v) {\r\n                this.innerHTML = v;\r\n            },\r\n            getValue: function() {\r\n                return this.innerHTML;        \r\n            }\r\n        });\r\n```\r\n\r\nTo make the code less messy and use some hacks for ``innerHTML`` behavior in Internet Explorer 8, use [html binder](http://matreshka.io/#!Matreshka.binders.html).\r\n\r\nYour code will look like this:\r\n```js\r\nthis.bindNode('x', '.my-span', MK.binders.html());\r\n```\r\n\r\nAs a \"bonus\", in case if you want to restore MK.Array from prerendered collection use [this guy](http://matreshka.io/#!Matreshka.Array-restore)\r\n"}}