# Slider incoherent behaviour when disabled

**URL:** <https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663>\
**Category:** Dashboard\
**Created:** [2 June 2020 13:56 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663 "2020-06-02T13:56:51Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [2 June 2020 13:56 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/1 "2020-06-02T13:56:52Z")

</div>

IMHO current implementation (v. 2.22.1) of dashboard-slider component in disabled mode has two flaws:

1. it moves leftwise to its minumum position while keeping its current payload value. That's uncoherent and the user might think its value reached its minimum.  
In the attached image current value is 20.6 while minimum is 15, but when disabled mode it moves to the minimum while keeping its correct value  

2. when receiving an msg.enabled = true it becomes active, but it keeps its left minimum position, whereas it should regain its current value position. See attached image where the slider becomes enabled but keeps its wrong left minimum value (15) whereas it should move towards the center (value 20.6)

 ![enabled](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/7/67a6d337984f906606919be7b231d27a60378893.png)

I suggest that in disabled mode the slider simply keeps its current position and updates it even after it's disabled, simply it will be no longer user operable. So when enabled again it will already have its correct position and the user simply will interact with it. In this way we would solve both before mentioned problems.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [2 June 2020 14:38 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/2 "2020-06-02T14:38:29Z")

</div>

not unreasonable

---

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [2 June 2020 15:35 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/3 "2020-06-02T15:35:53Z")

</div>

Hi dceejay,  
glad you second my considerations. Will you be able to report this issue to the dashboard team so they will give it a look?

Best

Roberto

---

<div class="post-metadata">

**Author:** ![ristomatti](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ristomatti/32/5857_2.png) [@ristomatti](https://discourse.nodered.org/u/ristomatti)\
**Post date:** [2 June 2020 16:14 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/4 "2020-06-02T16:14:12Z")

</div>

If this is one of the default dashboard nodes, you can consider @dceejay AS the team: [https://github.com/node-red/node-red-dashboard/graphs/contributors](https://github.com/node-red/node-red-dashboard/graphs/contributors). 🙂

---

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [2 June 2020 16:15 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/5 "2020-06-02T16:15:15Z")

</div>

Ok, so we are in good hands!

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [2 June 2020 21:20 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/6 "2020-06-02T21:20:14Z")

</div>

Hi,  
I have just done a simple test here and it seems to work as expected... can you share your example that doesn't ? and can you add a debug to the node that is sending to the slider ?

---

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [3 June 2020 07:04 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/7 "2020-06-03T07:04:08Z")

</div>

This is the sample flow :

 ![sample flow](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/a/aabeccf0e178ffec31c81e6f92b6cfdde53e075f.jpeg)

From the dashboard you see this after clicking on "Disable" button::

 ![dashboard](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/3/b3773b546398b16e72fa99611902c0de8c769031.png)

If after disabling you resend the msg.payload via the "Set value" slider the UI slider gets its correct position. What I expect is that the slider doesn't lose its correct value when receiving a "disable" msg.

This is the test script you can use to reproduce the problem:

```auto
[{"id":"66f8b17b.e89e","type":"debug","z":"ff9f6e72.01c63","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":2210,"y":240,"wires":[]},{"id":"bf59880f.c64f68","type":"ui_slider","z":"ff9f6e72.01c63","name":"setpoint UI","label":"Setpoint °C","tooltip":"","group":"f1c89d57.a8411","order":3,"width":"7","height":"1","passthru":true,"outs":"end","topic":"","min":"18","max":"26","step":"0.1","x":2230,"y":360,"wires":[[]]},{"id":"61325249.675dfc","type":"function","z":"ff9f6e72.01c63","name":"enable/disable","func":"msg.enabled = msg.payload;\nreturn msg;","outputs":1,"noerr":0,"x":2030,"y":360,"wires":[["bf59880f.c64f68"]]},{"id":"1ceb9bb7.667c64","type":"ui_slider","z":"ff9f6e72.01c63","name":"Value Provider","label":"Setpoint °C","tooltip":"","group":"f1c89d57.a8411","order":3,"width":"6","height":"1","passthru":true,"outs":"all","topic":"","min":"18","max":"26","step":"0.1","x":2020,"y":300,"wires":[["bf59880f.c64f68","66f8b17b.e89e","f86fbc93.0b024"]]},{"id":"f86fbc93.0b024","type":"ui_text","z":"ff9f6e72.01c63","group":"f1c89d57.a8411","order":5,"width":"2","height":"1","name":"Text Value","label":"","format":"{{msg.payload}}","layout":"row-spread","x":2230,"y":300,"wires":[]},{"id":"72fbd585.16864c","type":"ui_button","z":"ff9f6e72.01c63","name":"","group":"f1c89d57.a8411","order":6,"width":0,"height":0,"passthru":false,"label":"Enable","tooltip":"","color":"","bgcolor":"","icon":"","payload":"true","payloadType":"bool","topic":"","x":1840,"y":320,"wires":[["61325249.675dfc"]]},{"id":"3dc7a4b3.cfd06c","type":"ui_button","z":"ff9f6e72.01c63","name":"","group":"f1c89d57.a8411","order":7,"width":0,"height":0,"passthru":false,"label":"Disable","tooltip":"","color":"","bgcolor":"","icon":"","payload":"false","payloadType":"bool","topic":"","x":1840,"y":380,"wires":[["61325249.675dfc"]]},{"id":"f1c89d57.a8411","type":"ui_group","z":"","name":"Studio","tab":"6792269c.442228","order":2,"disp":true,"width":"7","collapse":true},{"id":"6792269c.442228","type":"ui_tab","z":"","name":"Stanze","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

```

HTH

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [3 June 2020 07:08 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/8 "2020-06-03T07:08:04Z")

</div>

Thanks, will take a look shortly.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [3 June 2020 08:23 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/9 "2020-06-03T08:23:15Z")

</div>

As I suspected - your function node is still sending a payload (of true or false) to the slider - which it then interprets as "no data". You need to clear out the msg.payload, or use a change node instead to "move" the payload to enabled.  
Here is your flow edited.

```auto
[{"id":"70dae570.6fe52c","type":"debug","z":"a3c2a16b.fa113","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":570,"y":1480,"wires":[]},{"id":"bc5f9e77.e136b","type":"ui_slider","z":"a3c2a16b.fa113","name":"setpoint UI","label":"Setpoint °C","tooltip":"","group":"3061152d.046afa","order":3,"width":"7","height":"1","passthru":true,"outs":"end","topic":"","min":"18","max":"26","step":"0.1","x":550,"y":1600,"wires":[[]]},{"id":"be5d18e5.f1ae08","type":"function","z":"a3c2a16b.fa113","name":"enable/disable","func":"msg.enabled = msg.payload;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":340,"y":1580,"wires":[[]]},{"id":"902e0524.c8d728","type":"ui_slider","z":"a3c2a16b.fa113","name":"Value Provider","label":"Setpoint °C","tooltip":"","group":"3061152d.046afa","order":3,"width":"6","height":"1","passthru":true,"outs":"all","topic":"","min":"18","max":"26","step":"0.1","x":340,"y":1540,"wires":[["bc5f9e77.e136b","70dae570.6fe52c","1a837a6a.c65de6"]]},{"id":"1a837a6a.c65de6","type":"ui_text","z":"a3c2a16b.fa113","group":"3061152d.046afa","order":5,"width":"2","height":"1","name":"Text Value","label":"","format":"{{msg.payload}}","layout":"row-spread","x":550,"y":1540,"wires":[]},{"id":"84e4201d.0d4fe","type":"ui_button","z":"a3c2a16b.fa113","name":"","group":"3061152d.046afa","order":6,"width":0,"height":0,"passthru":false,"label":"Enable","tooltip":"","color":"","bgcolor":"","icon":"","payload":"true","payloadType":"bool","topic":"","x":160,"y":1560,"wires":[["15893070.d3514"]]},{"id":"8e2be221.0bc2a","type":"ui_button","z":"a3c2a16b.fa113","name":"","group":"3061152d.046afa","order":7,"width":0,"height":0,"passthru":false,"label":"Disable","tooltip":"","color":"","bgcolor":"","icon":"","payload":"false","payloadType":"bool","topic":"","x":160,"y":1620,"wires":[["15893070.d3514"]]},{"id":"15893070.d3514","type":"change","z":"a3c2a16b.fa113","name":"","rules":[{"t":"move","p":"payload","pt":"msg","to":"enabled","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":1620,"wires":[["bc5f9e77.e136b","70dae570.6fe52c"]]},{"id":"3061152d.046afa","type":"ui_group","z":"","name":"Studio","tab":"f74bf3e6.eaf5e","order":2,"disp":true,"width":"7","collapse":true},{"id":"f74bf3e6.eaf5e","type":"ui_tab","z":"","name":"Stanze","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [3 June 2020 09:52 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/10 "2020-06-03T09:52:24Z")

</div>

In the function node I added the line:

msg.payload = null;

and now the slider position is not changed when disabling the node!  
However, as a side effect, now the slider raise an error to the debugger:

"TypeError: Cannot read property 'toString' of null".  
It's not harmful/meaningful, I just let you know.

As you suggest I used two change nodes of type "move" that converts a msg. payload to a msg.enabled.  
It works well and they do not raise errors. The debugger reports a "undefined" msg.payload, but that's fine.  
So I will adopt this second solution.

I couldn't imagine that a true/false payload sent to a slider resets its position to the left minimum while keeping its actual correct value!  
Since the slider it's an intrinsecally numerical node it should simply ignore a pure true/false payload.

Thank you again for your precious assistance.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [3 June 2020 10:21 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/11 "2020-06-03T10:21:51Z")

</div>

well it tries to be helpful and parse whatever you send to be a number (in case you send 20C for example) - so it parses false to 0 and thus moves the pointer. And indeed ISTR that behaviour may have been requested at some point as a way to indicate that the incoming values were invalid/unknown - so I'm not going to change that behaviour.

PS the way to do it in a function is to `delete msg.payload` rather than set to null.  
(but yes will look to catch that error)

---

<div class="post-metadata">

**Author:** ![Robertotarga](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/robertotarga/32/16890_2.png) [@Robertotarga](https://discourse.nodered.org/u/Robertotarga)\
**Post date:** [3 June 2020 10:41 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/12 "2020-06-03T10:41:27Z")

</div>

OK dceejay. I understand your point and will not insist in asking an alteration to the standard behaviour.  
I added the delete msg.payload to the function node and used this solution rather the one with two change nodes.  
I apreciate your efforts to teach the correct way to use the beautiful world of NR!

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [3 June 2020 10:44 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/13 "2020-06-03T10:44:47Z")

</div>

> [@dceejay](#):
>
> so it parses false to 0 and thus moves the pointer.

Should it not change the value shown to 0 in that case?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [3 June 2020 10:48 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/14 "2020-06-03T10:48:21Z")

</div>

you are correct - as it fails to parse it correctly it just moves the pointer to the minimum value the slider will accept.

---

<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:** [17 June 2020 10:53 UTC](https://discourse.nodered.org/t/slider-incoherent-behaviour-when-disabled/27663/15 "2020-06-17T10:53:18Z")

</div>

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