Description

Learn how to create parameterized popup windows that can be re-used for multiple objects depending on the values that were passed in.

Video recorded using: Ignition 7.7

Transcript

(open in window)

[00:00] In this lesson, we will learn how to pass parameters into a Popup window. That way, you can make a single Popup window, but change what a does and what it points to from a parameter that we pass in. So here we have a Popup window in the designer that I want to pass a value into. The first thing we have to do is add a custom property to the Root Container of the window that will accept the value that we pass in. So, we're going to right click on the Root Container, go down to Customizers and select Custom Properties. Here we can add one or more custom properties that'll be the parameters of this window. I'm going to go ahead and add one. I'm going to call this one "value", and I can select any data type that I want. So, in my case, I'm going to select a String. So now, once I press Okay, I'll see that property at the very bottom, down here, that I can work with. Now, it's really important that we do not bind these properties to anything. We want to make sure to leave these properties unbound, because we're going to pass a value into that property later on, and we don't want binding to overwrite that value that we pass in. So, now that I have the value here, I want to do something with it in the window. Let's just say I want to display that value in a label. So I'm going to go over here to my Component Palate, come down to Display, and drag the Label onto the window. And all I want to do is simply bind the text of the label to a property, selecting the value parameter that we added to the Root Container of the window, so, the value that we're going to pass in. What I'm going to do is, basically, just literally show the value here on the window that we passed in. So, now I have the window ready to go. I have a property on the Root Container that I can pass a value into, and we're going to show that value on a string. Now you can go to another window to open up this window and pass the value in. So here, a button on my Main Window One, that's going to open the Popups. I'm going to right click, go down to Scripting, and I'll see that, right now, it's set to Open and Center, the Popup window. On the right-hand side you'll have a checkbox here in a table, to pass parameters. You can simply check that box, press the Plus icon here to add one or more values that you want to pass in. So, I add one row here, and the parameter name. You want to specify the exact same name as the parameter. And there's a drop-down list here to show you all the custom properties that are added to that Popup window. So I could just simply select it here. So I'm going to pass a value into the value. The value that I want to pass in, you, of course, you can link to via the screen, or you can type it in. I'm going to type in "Hello World" here. So now, this button is going to open the Popup window and pass "Hello World" into the value property, which will be shown on that label. I'm going to go ahead and do this one more time. I'm going to duplicate this component. I have two of them, so I'm just going move it over here to the right, using my arrow keys. The second one, I'm going to open it up, but this time I'm going to pass a different value in. I want to pass in "Something Else". So, now I have two buttons opening in the exact same Popup window, except for one's passing "Hello World" and one's passing "Something Else". So now I'm ready to go. I can test this out in the run times. I'll go ahead save my project. I'm going to go to the run time. You can see I have two buttons here. Click on the first one to open the Popup. You can see a passed in "Hello World". I'm showing it on the label. If I go here and close it, go open the second Popup, or a second button here, open the window, pass in "Something Else" here. So, it's really easy to pass in values to the window. We can pass in one or more parameters to make that Popup window do something different, or point to something different.

You are editing this transcript.

Make any corrections to improve this transcript. We'll review any changes before posting them.