...
In this example, we’ll show you how to use BLOB fields in Profound UI. Below, we explain how to convert a BLOB field into an image, so that you can display this image in Profound UI. For this example, we will be making use of the pui.downloadURL() API and the PUIDNLEXIT program.
The PUIDNLEXIT Program
...
Below is the PUIDNLEXIT we set up for this example in its entirety:
...
We won’t go into detail about the parameters set in this exit program. You can learn more about the different parameters for the PUIDNLEXIT program in the documentation. It is also important to note that we did not modify any of the parameters in PUIDNLEXIT from sample that is shipped with Profound UI. Note, that but we are using the id property to pass a "key" value instead of an IFS path. You can read more about that here.
This PUIDNLEXIT program is called twice. The first time it is called before the download, timingFlag = 0. This is where you will actually write the image to the IFS in the program. IBM has more detailed information about LOB files here on their website that will also help you with understanding parts of this program. A few important notes about this section of the program:
- RECID is the ID value supplied to the pui.downloadURL() API. This will be your file’s key value.
- MYPIC_NAME is used in order to tell the program where to put the file. Notice in our program this is equal to “filename”“FILENAME”, which is contains a temporary name generated by the TMPNAM() API. You can find more information about the TMPNAM() API here.
The second time the PUIDNLEXIT program is called is after the download occurs, in which case timingFlag = 1. This is where you will want to delete the file from the IFS. To do this, we used the “unlink()” API. This API is simply used to delete a link. You can find more detailed information about this API here.
Using pui.downloadURL()
...
The display file that we used for this example is quite simple. Below you can see how this is set up in the Visual Designer:
...
We placed an image widget onto the screen and changed the "visibility" property of this image to "hidden", since we don’t want to see the default image. The “Download” button is where we use the pui.downloadURL() API. In the onclick event of this button, we have the following:
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
var imageSrc = pui.downloadURL({ "id": "BLOB:ANIMALS:1", "contentType": "image/jpeg" });
applyProperty('Image1', 'image source', imageSrc);
applyProperty('Image1', 'visibility', 'visible'); |
...
After downloading the image and setting this to a variable, “imageSrc”, we then use the applyProperty() API to change the "image source" property of our image to our downloaded image and change the visibility to “visible”, so that we can see the downloaded image. Now, when we click the download button, the image will download and appear in place of the image widget.
Final Result
...
After setting up our display file for our RPG program, and creating our PUIDNLEXIT program, we get the following result.
...