- Displaying Images

HTML Reference:

In this example we are going to show you how to display a single image within an operation. This might be useful to display a company logo or other operation specific images. In this application we have called to display company products as might be seen in a shopping cart.

If you want to add an image to your operation, say at the top of the data returned, open the operation to edit by clicking on the OP button.

Any image accessible on the web has a unique URL associated with it, and can therefore be rendered in a WOW application. In our example lets say we want to show the image of the gloves on the header of our operation.

Scroll down to the instructions section and insert desired HTML with the image URL. In order to find the image URL, right click on the image you want to copy and select copy image URL. Paste this into the HTML image tag, as shown below. More HTML image tag information can be found at http://www.w3schools.com/tags/tag_img.asp

After you have entered in the image URL, click update and the image will appear at the top of the operation.

Images based on database records:

More commonly image displays within WOW applications are data driven and associated with records of some kind, examples would be shopping carts or employee human resources app. WOW also supports database driven images as shown below. This initial screen shows the creation of a WOW operation that is bringing back product data. Note the highlighted section. We are assuming a user has all images saved in one folder. The highlighted section below tells WOW where to locate the images as further described below.

Along with this, user must decide which fields to display and set that within the property groups making sure references to the image field is set to display, as shown below.

Now if the application is run the data is returned but the images are not rendering properly.

Access the field descriptor by clicking on the gear icon of the desired field. As shown below, by updating Field Class to image URL reference the images will show as needed.

This is what the running application looks like with associated images.