• State Suggested Answer
  • Replies 6 replies
  • Answers 1 answer
  • Subscribers 8 subscribers
  • Views 5510 views
  • Users 0 members are here
Related Discussions
Home » Discussions » User Interface

How to add a row when a link(Icon) is clicked (not in grid)

pradeepb0001

Hi All,

I am having a requirement like image 1 mentioned below

i have created a section(rule) which will have all the UI components as shown in the image 1.When the + icon gets clicked another row should get added and should display like image 2.

mentioned below.

Kindly provide your suggestions regarding this requirement.

 

Thank you.

  Discussion posts and replies are publicly visible

Parents
  • 0
    @omere & @ Mike Schmitt

    Thank you for your suggestions.It will be helpful if you provide an example for adding an empty cdt type to a variable using dynamic link component.
  • 0
    Certified Lead Developer
     in reply to pradeepb0001
    Here's something along the lines of what you want. I think you have your gridrow configured correctly, so just focus on the image component.

    load(
    local!testCDT: type!CDTType(),
    {
    a!sectionLayout(
    label: "Section",
    contents: {
    a!gridLayout(
    label: "Editable Grid",
    labelPosition: "ABOVE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "Header Cell")
    },
    rows: a!forEach(
    items: if(
    or(
    rule!APN_isEmpty(local!testCDT),
    count(local!testCDT) < 1
    ),
    {},
    1+enumerate(count(local!testCDT))
    ),
    expression: rule!/* your rule for your grid row layout here */
    ),
    a!imageField(
    images: {
    a!documentImage(
    document: a!iconIndicator("ADD"),
    link: a!dynamicLink(
    value: local!testCDT,
    saveInto: a!save(local!testCDT, append(local!testCDT, type!CDTType())
    )
    )
    }
    )
    }
    )
    }
    )
Reply
  • 0
    Certified Lead Developer
     in reply to pradeepb0001
    Here's something along the lines of what you want. I think you have your gridrow configured correctly, so just focus on the image component.

    load(
    local!testCDT: type!CDTType(),
    {
    a!sectionLayout(
    label: "Section",
    contents: {
    a!gridLayout(
    label: "Editable Grid",
    labelPosition: "ABOVE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "Header Cell")
    },
    rows: a!forEach(
    items: if(
    or(
    rule!APN_isEmpty(local!testCDT),
    count(local!testCDT) < 1
    ),
    {},
    1+enumerate(count(local!testCDT))
    ),
    expression: rule!/* your rule for your grid row layout here */
    ),
    a!imageField(
    images: {
    a!documentImage(
    document: a!iconIndicator("ADD"),
    link: a!dynamicLink(
    value: local!testCDT,
    saveInto: a!save(local!testCDT, append(local!testCDT, type!CDTType())
    )
    )
    }
    )
    }
    )
    }
    )
Children

© 2024 Appian. All rights reserved.