# All in a bit of a state over persistence

**URL:** <https://discourse.nodered.org/t/all-in-a-bit-of-a-state-over-persistence/36017>\
**Category:** Dashboard\
**Created:** [16 November 2020 18:11 UTC](https://discourse.nodered.org/t/all-in-a-bit-of-a-state-over-persistence/36017 "2020-11-16T18:11:42Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![ozpos](https://avatars.discourse-cdn.com/v4/letter/o/278dde/32.png) [@ozpos](https://discourse.nodered.org/u/ozpos)\
**Post date:** [16 November 2020 18:11 UTC](https://discourse.nodered.org/t/all-in-a-bit-of-a-state-over-persistence/36017/1 "2020-11-16T18:11:42Z")

</div>

Hi All,  
Can I protect the state of this ui\_template from destruction ?  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/7/57475b786ff3f74280429a92b8241c2d9410d555.png) ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/4/344fcd86ddbf52e4b9c720dc6daa132954a95d7f.png)

```auto
[{"id":"ad319c09.2a975","type":"tab","label":"Flow 1","disabled":false,"info":""},{"id":"bab5636b.6d0c6","type":"debug","z":"ad319c09.2a975","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":270,"y":40,"wires":[]},{"id":"22241d3f.0a1222","type":"ui_button","z":"ad319c09.2a975","name":"{\"ok\":\"100\"}","group":"b2f10ee0.a622c","order":3,"width":"2","height":"1","passthru":false,"label":"{{value}}","tooltip":"","color":"","bgcolor":"","icon":"","payload":"{\"ok\":\"100\"}","payloadType":"json","topic":"","x":90,"y":80,"wires":[["de4eba3b.464b58"]]},{"id":"9c780ee.635ebf","type":"ui_button","z":"ad319c09.2a975","name":"{\"ok\":\"101\"}","group":"b2f10ee0.a622c","order":3,"width":"2","height":"1","passthru":false,"label":"{{value}}","tooltip":"","color":"","bgcolor":"","icon":"","payload":"{\"ok\":\"101\"}","payloadType":"json","topic":"","x":90,"y":120,"wires":[["de4eba3b.464b58"]]},{"id":"bef397bf.cace28","type":"ui_button","z":"ad319c09.2a975","name":"{\"bad\":\"911\"}","group":"b2f10ee0.a622c","order":3,"width":"2","height":"1","passthru":false,"label":"{{value}}","tooltip":"","color":"","bgcolor":"","icon":"","payload":"{\"bad\":\"911\"}","payloadType":"json","topic":"","x":90,"y":160,"wires":[["de4eba3b.464b58"]]},{"id":"de4eba3b.464b58","type":"ui_template","z":"ad319c09.2a975","group":"b2f10ee0.a622c","name":"","order":2,"width":"6","height":"5","format":"<h1>Msg Topic: {{msg.topic}}</h1>\n<h2>Msg Payload: {{msg.payload}}</h2>\n<div ng-model=\"msg.payload.ok\" ng-bind-html=\"msg.payload.ok\"></div>\n<h2>Calculated after receiving a msg</h2>\n<div>{{myCalc}}</div>\n<h2>Call a function on click</h2>\n<div ng-click=\"click(b)\">Click me to change the number</div>\n<div>{{myNum}}</div>\n\n<script>\n // Lambda function to access the Angular Scope\n ;(function(scope) {\nconsole.log(\"- Scope Top -\",scope)\n //Have to use $watch so we pick up new, incoming msg's\n scope.$watch('msg.payload', function(newVal, oldVal) {\nconsole.log('- Scope.msg.payload - newVal=' + newVal + ' oldVal=' + oldVal)\nconsole.dir(newVal)\nconsole.dir(oldVal)\nconsole.dir(scope.msg)\n if(newVal==undefined && oldVal==undefined) return\n// if(typeof newVal == 'undefined') {\n if(!newVal.ok) {\nconsole.log(\"!newVal.ok\")\n if(oldVal!==undefined && oldVal.ok) {\nconsole.log(\" newVal=oldVal 1\")\n newVal.ok=oldVal.ok\nconsole.log(\" newVal=oldVal 2\")\n }\n// scope.msg={\"payload\": newVal}\n }\nconsole.log(\"scope.msg.payload.ok=newVal 1\")\n scope.msg.payload.ok = newVal.ok\nconsole.log(\"scope.msg.payload.ok=newVal 2\")\n \nconsole.log(\"myCalc\")\n scope.myCalc = scope.msg.payload.ok * 2\n console.log(\"4\")\n })\n\n // Function triggered by clicking on a div\n scope.click = function(b) {\n if ( ! scope.myNum ) scope.myNum = 0\n scope.myNum++\n }\n })(scope)\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":220,"y":40,"wires":[["bab5636b.6d0c6"]]},{"id":"b2f10ee0.a622c","type":"ui_group","name":"dashboard@2.24.1-beta","tab":"2e3a1e8a.cb68a2","order":1,"disp":true,"width":"6","collapse":true},{"id":"2e3a1e8a.cb68a2","type":"ui_tab","name":"State Experiments 1880","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

```

If I click OK:100 or OK:101 the values are restored on browser refresh and all is wonderful.

If I click on BAD:911 I can stop the display of the value but a browser restore returns the last state.

How can I stop my ui state from being corrupted in this fashon ?

P.S. A big thank you goes to [Julian Knight](https://it.knightnet.org.uk/) for the code examples and explanations.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [16 December 2020 18:11 UTC](https://discourse.nodered.org/t/all-in-a-bit-of-a-state-over-persistence/36017/2 "2020-12-16T18:11:47Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
