Display multiple files in a grid

Hi apoorvam 

 Please find the below code just replace it with valid folder ids.

load(
  local!data: {
    {
      id: 1,
      folderId: 5180/* Folder ids*/
      
    },
    {
      id: 2,
      folderId: 7366/* Folder ids*/
      
    }
  },
  a!gridLayout(
    label: "Editable Grid",
    labelPosition: "ABOVE",
    headerCells: {
      a!gridLayoutHeaderCell(
        label: "Header Cell"
      )
    },
    columnConfigs: {},
    rows: {
      a!forEach(
        items: local!data,
        expression: a!gridRowLayout(
          id: fv!index,
          contents: a!richTextDisplayField(
            value: a!forEach(
              items: folder(
                index(
                  fv!item,
                  "folderId",
                  {}
                ),
                "documentChildren"
              ),/*Getting documents from folder*/
              expression: {
                a!richTextItem(
                  text: document(
                    fv!item,
                    "name"
                  ),
                  link: a!documentDownloadLink(
                    document: fv!item
                  )
                ),
                a!richTextItem(
                  text: "  ",
                  showWhen: not(
                    fv!isLast
                  )
                )
              }
            )
          )
        )
      )
    },
    selectionSaveInto: {},
    validations: {},
    shadeAlternateRows: true
  )
)

 

Regards,

Sachin

Thanks a lot!

Is there is a way to display the fields one after the other in vertical rows? Thanks!

load(
local!data: {
{
id: 1,
folderId: 5180/* Folder ids*/

},
{
id: 2,
folderId: 7366/* Folder ids*/

}
},
a!gridLayout(
label: "Editable Grid",
labelPosition: "ABOVE",
headerCells: {
a!gridLayoutHeaderCell(
label: "Header Cell"
)
},
columnConfigs: {},
rows: {
a!forEach(
items: local!data,
expression: a!gridRowLayout(
id: fv!index,
contents: a!richTextDisplayField(
value: a!forEach(
items: folder(
index(
fv!item,
"folderId",
{}
),
"documentChildren"
),/*Getting documents from folder*/
expression: {
a!richTextItem(
text: document(
fv!item,
"name"
),
link: a!documentDownloadLink(
document: fv!item
)
),
a!richTextItem(
text: char(10),
showWhen: not(
fv!isLast
)
)
}
)
)
)
)
},
selectionSaveInto: {},
validations: {},
shadeAlternateRows: true
)
)

Can you explain a bit more about your use case it will be helpful for us to get more clarity.

Hi Sachin,

I need to display all the documents contained in a particular folder in the form of a grid as follows:

 

Hi You can use, GetDocumentsFromFolder function to retrieve details of documents from a folder and then display it in the grid.
Why cannot you use the Browser Component that is available?

Thank you saivineeths . This works but is there a way to add paging to this?

Thank you saivineeths . This works but is there a way to add paging to this?

Hi apoorva,
Please find the updated code

load(
local!data: {
{
id: 1,
folderId: 81389/* Folder ids*/

},
{
id: 2,
folderId: 81469/* Folder ids*/

}
},
local!batchSize: 3,
local!gridSelection: a!gridSelection(
pagingInfo: a!pagingInfo(
startIndex: 1,
batchSize: local!batchSize,
sort: a!sortInfo(
field: "createdAt",
ascending: true()
)
)
),
local!doc: tointeger(
a!forEach(
items: index(
local!data,
"folderId",
{}
),
expression: folder(
fv!item,
"documentChildren"
)
)
),
with(
local!docPi: index(
local!doc,
local!gridSelection.pagingInfo.startIndex + enumerate(
if(
count(
local!doc
) - local!gridSelection.pagingInfo.startIndex < local!batchSize,


count(
local!doc
) - local!gridSelection.pagingInfo.startIndex+1,
local!batchSize
)
),
null
),
a!sectionLayout(
contents: {
a!gridLayout(
label: "Test Grid",

labelPosition: "ABOVE",
headerCells: {
a!gridLayoutHeaderCell(
label: "Document"
),
a!gridLayoutHeaderCell(
label: "Uploaded By"
)
},
columnConfigs: {},
rows: {
a!forEach(
items: local!docPi,
expression: a!gridRowLayout(
id: fv!index,
contents: {
a!richTextDisplayField(
value: a!richTextItem(
text: document(
documentId: fv!item,
property: "name"
),
link: a!documentDownloadLink(
document: fv!item
)
)
),
a!textField(
value: document(
documentId: fv!item,
property: "lastUserToModify"
),
readOnly: true()
)
}
)
)
},
selectionSaveInto: {},
validations: {},
shadeAlternateRows: true
),
a!richTextDisplayField(
align: "RIGHT",
value: {
a!richTextItem_18r1(
showWhen: not(
local!gridSelection.pagingInfo.startIndex = 1
),
text: "<",
link: a!dynamicLink(
saveInto: {
a!save(
local!gridSelection,
a!gridSelection(
pagingInfo: a!pagingInfo(
startIndex: local!gridSelection.pagingInfo.startIndex - local!batchSize,
batchSize: local!batchSize
)
)
)
}
)
),
" ",
local!gridSelection.pagingInfo.startIndex,
" - ",
if(
local!gridSelection.pagingInfo.startIndex + local!gridSelection.pagingInfo.batchSize - 1 > count(
local!doc
),
count(
local!doc
),
local!gridSelection.pagingInfo.startIndex + local!gridSelection.pagingInfo.batchSize - 1
),
" of ",
count(
local!doc
),
" ",
a!richTextItem_18r1(
showWhen: (
count(
local!doc
) >= local!gridSelection.pagingInfo.startIndex + local!batchSize
),
text: ">",
link: a!dynamicLink(
saveInto: {
a!save(
local!gridSelection,
a!gridSelection(
pagingInfo: a!pagingInfo(
startIndex: local!gridSelection.pagingInfo.startIndex + local!batchSize,
batchSize: local!batchSize
)
)
)
}
)
)
}
)
}
)
)
)