Call us! 512-349-0334 or (877) INDUSOFT

Using a Button in InduSoft Web Studio to Display a Document

Occasionally InduSoft Web Studio users wonder about how to open a document or hyperlink using a button within an InduSoft Web Studio Project.  It’s easy.

1. To open a Hyperlink, place a button in your project, then in the “Animations” Section (of the “Graphics” Tab, and with the button still highlighted, select “Hyperlink” animation to associate this animation with the button object (Figure 1).

Figure 1: Select the new button and associate the Hyperlink Animation to it.


2. Click on the “Properties” of the button (Right-Click on the button, then select “Properties” from the menu).

3. In the Pull-Down in the upper right of the dialog box, select “Hyperlink” then in the “URL” field place the entire URL of the file in the field, or if the file is local, place the entire path to the document into the field (Figures 2 and 4).


Figure 2: Enter the folder in the IWS project (or the complete path) in the “URL” Field.  The “Type” is automatically implied and you don’t normally need to change it.


4. The document can be of any type (i.e., .txt file, .pdf file, .doc(x) file, .html file, etc.) as long as there is a default application on the local computer that can display it (Figure 3).


Figure 3:  Pressing the button during runtime will attempt to run the file (similar to double-clicking on it in Windows Explorer) and open the file in the associated default application (i.e. Adobe Reader).


5. Tip:  If the document is being stored in the InduSoft Application so that it can be moved or installed on a different machine along with the project, create a separate folder for it in the project root folder such as “\Reports” and place the file there.  In the URL field, simply enter:


Don’t put a backslash in front of {foldername}.  Indusoft Web Studio will assume that this is a folder which is part of the project root folder structure, and automatically add the project location to the ‘folder\filename.extension’ that you specified (Figures 2 and 4).

Figure 4: Placing the document into the IWS Project Folder Structure.  Note that the file has an associated default application (i.e., Adobe Reader) as indicated by the icon next to the file name.


More information is covered in the HELP DOCUMENT when searching on “Hyperlink” Animation and in the Training Videos at: Animations Overview Video and Animations Details Video.

Comments are closed.