Display multiple files in a grid

Hi folks, 

 

I need to display multiple files stored in a particular folder in a grid on an interface. 

 

Any help will be appreciated. TIA. 

  Discussion posts and replies are publicly visible

Parents
  • Hi  

     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

  • 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
    )
    )
Reply
  • 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
    )
    )
Children
  • Thank you . 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
    )
    )
    )
    }
    )
    )
    }
    )
    }
    )
    )
    )