# Label component used to change key:value property with itself **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [November 17, 2023, 7:22pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072 "2023-11-17T19:22:54Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Dan\_Gohr](https://avatars.discourse-cdn.com/v4/letter/d/e0b2c6/32.png) [@Dan\_Gohr](https://forum.inductiveautomation.com/u/Dan_Gohr)\ **Post date:** [November 17, 2023, 7:22pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/1 "2023-11-17T19:22:54Z")
I am using version 8.1.28. New to python scripting and all the power it has, trying to teach myself as I go, creating a plant monitoring system. I have opc tags brought in showing info on our water heaters. I have shown what I want the main display to show for each WH. There are other tags that I want to bring in and diplay on the same "screen" (vent temp, burn cycles & runtime, etc). I want the large temp readout and discription above to change when you click on "next \>". I used a label component for this so called button because I prefer the way it looks compared to an actual button component. My thought was to have a custom porperty change value (DisplayNum:value) when you click on it. Just an integer (0= for main, 1= vent temp, 2= cycles, 3= runtime, and so on). Based on what number is in the key:value pair for that label component, I can then bind the visibility property for the tags to be 'true' or 'false' based on what number is in the next label component. I figured out in the script console how to have a repeating sequence but when I put that script on the label component I get the error shown. Any guidance would be appreciated. Hope this makes sense as to what I'm try to accomplish. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/f/9f22eab75b08216bfa38a03e27a37d17fe77802a.png) ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/6/86ab0c65e54007aff555525a0efb2b1dc0b5fb2b.png) ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [November 17, 2023, 7:43pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/2 "2023-11-17T19:43:30Z")
The problem is with `value = value + 1` `value` hasn't been declared anywhere and, effectively, doesn't exist. Instead, - Create a custom property on the label. e.g. `displayNum : 0`. - The corrected code should be something like, ```auto self.custom.displayNum = (self.custom.displayNum + 1) % 5 ``` (If it weren't for the modulo operation the line could have been reduced to `self.custom.displayNum += 1`.) Use the property selector button on the right of the script editor for error-free selection of the property name. ---
**Author:** ![Dan\_Gohr](https://avatars.discourse-cdn.com/v4/letter/d/e0b2c6/32.png) [@Dan\_Gohr](https://forum.inductiveautomation.com/u/Dan_Gohr)\ **Post date:** [November 17, 2023, 7:48pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/3 "2023-11-17T19:48:48Z")
Thank you! ---
**Author:** ![leonardo.godoi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/leonardo.godoi/32/27178_2.png) [@leonardo.godoi](https://forum.inductiveautomation.com/u/leonardo.godoi)\ **Post date:** [November 17, 2023, 7:57pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/4 "2023-11-17T19:57:54Z")
From the beginning: > [@Dan\_Gohr](#): > > My thought was to have a custom porperty change value (DisplayNum:value) For this you'll have to select your label component with the "Next" text and add a custom property with the name you want, under custom click on Add Custom Property, select "Value" then add this custom property. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/f/0fa909b6d6958c3a78c9c5bc7dca77f86560d516.png) > [@Dan\_Gohr](#): > > Based on what number is in the key:value pair for that label component This is where we`ll add the onClick script but we'll change a few things: ```auto # First we need to get our current value, we can't use # value = value + 1 because we didn't even define what the variable # called value is yet. # So we grab value from the component's custom property. value = self.custom.DisplayNum +1 if value > 5: #If the value is > 5, we return it to 0 value = 0 # Then, after we define what the value will be, we need to pass it back to the # label's custom property self.custom.DisplayNum = value ``` > [@Dan\_Gohr](#): > > I can then bind the visibility property for the tags to be 'true' or 'false' based on what number is in the next label component. you mean having multiple components on the same position but only show one based on visibility? If that's your plan, there's a much better way using indirect tag binding, build only one set of components and change the tag paths that they're bound to. [https://docs.inductiveautomation.com/display/DOC81/Tag+Bindings+in+Perspective#TagBindingsinPerspective-IndirectTagBindingMode](https://docs.inductiveautomation.com/display/DOC81/Tag+Bindings+in+Perspective#TagBindingsinPerspective-IndirectTagBindingMode) If you're new to python and ignition i would highly recommend you to take a look at at least a few of the credential course classes available at [https://www.inductiveuniversity.com](https://www.inductiveuniversity.com) , they're free and very well explained so at least it would be a good idea to watch the ones about the topic/component you're currently working on. ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [November 17, 2023, 8:26pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/5 "2023-11-17T20:26:53Z")
> [@leonardo.godoi](#): > > ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/f/0fa909b6d6958c3a78c9c5bc7dca77f86560d516.png) I think you need to initialise this with a numeric value when you create it. Otherwise `value = self.custom.DisplayNum + 1` will give an error when calculating `"value" + 1`. ---
**Author:** ![Dan\_Gohr](https://avatars.discourse-cdn.com/v4/letter/d/e0b2c6/32.png) [@Dan\_Gohr](https://forum.inductiveautomation.com/u/Dan_Gohr)\ **Post date:** [November 17, 2023, 8:40pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/6 "2023-11-17T20:40:37Z")
Thanks for your expertise. I got it working the way I wanted. I am going to check out the indirect binding, sounds like a less cumbersome way. ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [November 17, 2023, 8:43pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/7 "2023-11-17T20:43:11Z")
That's great. Don't forget to mark the answer that helped most as "Solution". That way it shows up on the main index as solved. ---
**Author:** ![leonardo.godoi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/leonardo.godoi/32/27178_2.png) [@leonardo.godoi](https://forum.inductiveautomation.com/u/leonardo.godoi)\ **Post date:** [November 17, 2023, 8:48pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/8 "2023-11-17T20:48:06Z")
You're right, otherwise it wouldn't work. ---
**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\ **Post date:** [November 17, 2023, 9:10pm UTC](https://forum.inductiveautomation.com/t/label-component-used-to-change-key-value-property-with-itself/82072/9 "2023-11-17T21:10:31Z")
> [@Dan\_Gohr](#): > > I used a label component for this so called button because I prefer the way it looks compared to an actual button component. I would recommend that instead of defaulting to the Label component, instead, use styling to make the button appear the way you want. For instance this is a button that has been modified using styles: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/5/051bf6b06d0639c7ef5321386230db205c78f4b4.png) > **Styles** > > ```auto > { > "backgroundColor": "#00D9D9", > "borderStyle": "solid", > "color": "#000000", > "fontFamily": "Arial", > "fontSize": 14, > "fontWeight": "normal", > "borderColor": "#000000", > "borderBottomRightRadius": 0, > "borderTopLeftRadius": 0, > "borderTopRightRadius": 0, > "borderBottomLeftRadius": 0 > } > > ``` You should create a Style Class and apply it to all of your buttons that you want to look similar. I will also say that there is a reason that most buttons look a certain way and that users are accustomed to that look and so changing it might be something you want to give a little more thought. That being said, consistency throughout the application is much more important than consistency with industry standards so, you do you, just make sure you do it everywhere. Anyway, the reason to do this, is so that you can use the `actionPreformed` event handler. This way, if you ever need to disable the button, then the event wont fire. A labels click event will fire independent of if the component is disabled or not.