Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

There are a few cool things you can do with attachments, provided you are not scared of a little JavaScript.  Hopefully I have provided enough context for those of you that are not fluent in JavaScript.  If anything is unclear please comment and I will fix-up the article until it is.

Table of Contents


Info

As of version 8.6.4 the URL used to access attached files has changed.  The format is now "/forms/secure/org/data/<app_id>/<form_id>/attachment/<attachment_uid>.  The parts can be dynamically determined: app.getUID(), form.getId() and BO.F_Attachment.getValue().uid.  This new approach should be applied to the rest of the content in this article for any applications built using 8.6.4 or higher.  The old URL still works, but may be removed in the future.


Get Attachment File Name

You can use getValue() to retrieve the attachment object and display filename in your form.

var filename = get(BO.F_Attachment.getValue(), "fileName");

"F_Attachment" is the ID of the Attachment object that you created.  You can check out the ID from the Advanced Tab of the item properties.


Render Submitted Attachment in a later stage

1. Create an Attachment object (id = F_Attachment)

2. Create an HTMLFragment

3. Place this code in the HTML FragmentonShowevent:

Code Block
languagejs
var attachmentid = BO.F_Attachment.getValue().id;
var url = "/forms/secure/org/run/service/ContentStorageService/" + attachmentid;

item.setContent("<img src='" + url + "'></url>");

It is important to note that the content of an attachment cannot be displayed until the form has been submitted.  The URL here is using the REST API to get the content of the attachment, but until the form has been submitted the attachment is not available on the server.

4. When your form gets to the next stage you will now see the image rendered!  You may want to consider hiding the HTMLFragment widget until the next stage.

InfoAs of version 8.6.4 the URL used to access attached files has changed.  The format is now "/forms/secure/org/data/<app_id>/<form_id>/attachment/<attachment_uid>.  The parts can be dynamically determined: app.getUID(), form.getId() and BO.F_Attachment.getValue().uid.  This new approach should be applied to the rest of the content in this article for any applications built using 8.6.4 or higher.  The old URL still works, but may be removed in the future

.

Provide link to attached file in a later stage (on a different page then where the attachment is)

1. Create an Attachment object (id = F_Attachment)

2. Create a Web Link object (in the Specialized palette)

3. Place this code in theonShowevent:


Code Block
languagejs
var attachmentid = BO.F_Attachment.getValue().id;

var url = "/forms/secure/org/run/service/ContentStorageService/" + attachmentid;

item.setDisplayValue(BO.F_Attachment.getValue().fileName);
item.setLinkValue(url);


4. When the page where the link is rendered the link display will be set to the filename and clicking on the link will open/download the file.

You can access the file name at anytime even before the form has been submitted, but you cannot create a valid link to the attachment until the form has been submitted.

Allowing Users' to Attach Multiple Attachments

You can place the Attachment item within a table.  Then I would recommend having two single line fields; one for the filename and the other for the attachment ID.  In the onItemChange event of the attachment item you can use the following JavaScript to set the field values:

Code Block
languagejs
BO.F_SingleLine0.setValue(BO.F_Attachment0.getValue().fileName.replace("C:\\fakepath\\", ""));
BO.F_SingleLine1.setValue(BO.F_Attachment0.getValue().id);


...