You can help by commenting or suggesting your edit directly into the transcript. We'll review any changes before posting them. All comments are completely anonymous. For any comments that need a reply, consider emailing training@inductiveautomation.com.
Version:
LESSON
Use Dynamic Data Key
Description
Learn how to make properties on report components dynamic by binding data keys.
Video recorded using: Ignition 8.1
Transcript
(open in window)[00:00] With dynamic data keys, you can modify properties on report components such as the background color or width based on the value of a key. As an example, you can see I have this report viewer on my window, which is displaying my fruit inventory report. I'd like to set this window up so that the slider component can set the width of my quantity column, which is this column with the gray background. Additionally, I want to be able to use the checkbox to hide or display the column. You can see that any parameters we create on the report are exposed to the client, so that means we can make changes to the report from the runtime. Let's start adding the dynamic keys by navigating to the fruit inventory report in the project browser, and then going to the data tab. We'll add a new parameter here and let's name this is visible. We'll give it a parameter type of boolean and a default value of true. Let's create one more parameter and name it width.
[01:09] We'll give it a type of long and a default value of 100. Now that we have our keys, let's move to the design tab and apply them to the correct properties. We can expand our parameters folder, and you can see our new parameters are there. Again, we want to control the properties on our quantity column, so let's select the quantity column and open up the properties tab in the property inspector. You'll notice a normal data key like this text property here is encapsulated with the at symbol. However, we'll scroll down to our basic properties where we see visible and width, and if I drag in is visible to our visible property, the at symbols are removed, letting us know this is a dynamic data key. The difference here is that a data key is meant to display the value of a key, such as the text property we saw earlier, whereas a dynamic data key lets you modify non string properties on reports. Instead of dragging in our width parameter we can also right click on the selected property and choose the used dynamic data key option.
[02:07] Then you can click on the magnifying glass, where you'll be able to browse for the parameter you'll want, and of course we'll choose width here and click on okay. If you want to remove the dynamic key, you can right click on the property and choose to use the static value. If we go to the preview tab, we don't see much here. However, the column width is set to 100 pixels and it is visible as we would expect. Let's go back to our window to better view the column's behavior as we update the dynamic keys. We'll select our report viewer and go down to our report parameters. We can see the dynamic keys are here. I could override is visible and set it to false, and we'll see the column disappear so we know that it's working. Let's go ahead and bind these to our components. I'll click on the chain link icon for is visible and we'll choose a property binding. We'll expand the checkbox and bind to our selected property. We'll do a property binding on our width as well and bind it to the value of our slider.
[03:05] So if we come to the preview mode, we can go ahead and adjust the slider and we can choose to hide or show, the column, so you see that when we run the report or when we just expose the report to the client, we can go ahead and make a lot of changes using dynamic data keys that will tailor the report to the specific need at that time.