Display File Name along with Download Link¶

When a file is uploaded to Vinyl for the purpose of being available as a download, Vinyl displays the file size along with a download link by default. In this article we will provide an overview on how to change the file size information being displayed to the file name value instead. This example assumes you have an underlying Table with a Column that is a File Logical type to store the file data.

Example Vinyl default behavior to display file size along with download link

How to Change the File Size Display to File Name¶

1. Navigate to an app page containing a file download link and identify the Link Address information:

   1. Open Developer Inspector Tools in web browser
   2. Click the Network tab, then click Clear
   3. In Vinyl, click the download icon so that you see the Save prompt

   4. Return to Network tab and there should be a single entry for the file download

      

      Illustrating Copy using Inspector

   5. Right click on the entry and select Copy > Copy URL

   6. Paste into text editor program, like Notepad

   7. Modify the value so that it begins with 'service/... . It will look something like:

      'service/file/control/de6fe101-d63b-427d-81d7-5bfcaf6eb407/table/fa2d1a46-6ca0-4064-9765-69bbfd1c8027/field/d14ee8e6-3242-42b6-9692-1f28416fe382/download?EmployeeID=' || cast(EmployeeID as nvarchar(50)) || '&%24timeZoneOffset=-240&%24timeZone=America%2FNew_York&%24pageId=2f8f4a8a-9da9-4300-bf37-86b1b9d25d68&%24windowId=9ebd097d-4c2a-4b63-8170-99ddf4a8bbd0'

2. Navigate to the Business Logic view of the Business Object driving the panel

3. Add a new dynamic substitution Column record to the Business Rule where you will sub in your Primary Key into the URL

   1. Enter the value obtained in Step 1 into the Column or Expression field
   2. Name it downloadlink

4. Create a new Text Control Type

   1. Name it Download Link
   2. Set the Column to downloadlink
   3. Set the Edit State to Hidden

5. Create a new Text Control Type

   1. Name it FileName
   2. Set the column to Filename
   3. From the control Edge Case tab, set the Link Target to {{downloadlink}}

6. Navigate back to the application page view, refresh the web browser, and confirm you now see the File Name appear vs. the File Size. Clicking the file name will download the file.

   

   Finished example with File Name displaying instead of the File Size for file download