How can I display a document from a link in a grid?

Hello,

I have a read-only grid that is displaying results from an integration that is stored in a variable. 

I also have a folder that contains documents that are related to the grid rows. 

I would like to dynamically display the related document in a new interface/window. I am able to configure the documentDownloadLink, but would like to display using the documentViewerField instead.

Here is the current interface. Please be kind, it's my first attempt and have been playing around a lot. I've hard coded the document value for now but will be using finddocumentsbyname to retrieve the document id.

= a!localVariables(
/* Set up the initial paging and sorting values */
local!pagingInfo: a!pagingInfo(
startIndex: 1,
batchSize: 1000,
sort: a!sortInfo(field: "submitTimeUTC", ascending: false)
),
CardCode: "C25000",
local!id: finddocumentsbyname(
searchAllContent: true,
documentNameToSearchFor: "A_R Invoice*- 7649"
),
/* Call the external system to return transactions using the paging info provided in local!pagingInfo*/
local!transactionListPage1: rule!AR_GetInvoices(CardCode).result.body.invoice,
/*local!transactionListPage: rule!AR_GetInvoices_recordDataSource(),*/
/*local!transactionListPage: rule!AR_Invoices(),*/
{
a!textField(
label: "Customer ID",
labelPosition: "ABOVE",
value: CardCode,
saveInto: CardCode,
refreshAfter: "UNFOCUS",
validations: {}
),
a!gridField(
data: local!transactionListPage1,
columns: {
a!gridColumn(
label: "Date",
value: text(fv!row.documentdate, "mmmm dd, yyyy")
),
a!gridColumn(
label: "Due Date",
value: text(fv!row.due, "mmmm dd, yyyy")
),
a!gridColumn(
label: "Invoice Number",
value: fv!row.documentnumber
),
a!gridColumn(label: "Comments", value: fv!row.comments),
a!gridColumn(
label: "Amount Paid",
value: dollar(fv!row.paidtodate)
),
a!gridColumn(
label: "Invoice Total",
value: dollar(fv!row.doctotal)
),
a!gridColumn(
label: "Status",
value: fv!row.documentstatus
),
a!gridColumn(
label: "Grid Column",
value: a!linkField(
links: {
a!documentDownloadLink(
label: "Test",
document: 3531
)
}
)
)
}
),
a!documentViewerField(
label: "Document Viewer",
labelPosition: "ABOVE",
document: "3531",
height: "MEDIUM"
)
}
)

  Discussion posts and replies are publicly visible

  • 0
    Certified Lead Developer

     Set a local variable (null by default) to hold the document ID you want to open in the previewer field.  Then in the grid column, have a link (use a rich text field instead of a!linkField()) which simply saves that row's doc ID into that local variable.  You already have the document viewer field set up below the grid properly, you'd just tweak such that it points to the doc ID found in that local variable, and only shows up when that local variable value is not null.

    Further: you would only want to enable that link on grid rows where the document is of a compatible type like PDF.  In rows for other doc types, you could just have the download link.

    As a side note: when posting code like this, there's a feature here called "Insert Code" (found in the "Insert" menu here in the comment editor), which will give you a monospace-font code box to paste multiple lines of code into.  Most importantly is that it retains formatting like indentation and thus makes code a lot more readable when posted.

  • There are two ways to display the image, using a!imageField() which lets you display the image in a cell and the other is using a!documentViewerField() to display the image below or to the side of the grid when selected. I think the easiest option is to use a!imageField() and also provide a download link using a!richTextDisplayField with a download icon.