How to show the results in fixed box

Question

I have a requirement that in a screen, I have to populate around 20 to 30 results(example shown in the end how to show the data in each box) each in a box / layouts. 
 When I populated the data in the UI for 20 results, the screen is expanding Vertically till the last results. what we need is to have fixed components (layout / section / anything) to show all the results in one BOX and user can scroll only that box to see all the results instead of scrolling the entire screen. Also the UI looks very bad as the other parts of the screen is adjusted according to the results.

1. 
 Name: XXX 
 Age: XX 
 Gender: XXX 
 City: XXX 
 State: XXX 
 
 2. 
 Name: 
 Age: 
 Gender: 
 City: 
 State

Harsha Sharma · Answer

Hi, to suit your requirement use cardlayout() with height as "MEDIUM"/"SHORT" as you desire and place the fields inside the content. This way the space will be fixed and scroll bar will be available . 
 Hope it helps.

rudrakshakammarig · Answer

Hope below code will be helpful to you. load(
 local!data: {
 {
 Name: "ABC",
 Age: 20,
 Gender: "Male",
 City: "City",
 State: "State",
 
 },
 {
 Name: "XYZ",
 Age: 25,
 Gender: "Male",
 City: "City",
 State: "State",
 
 },
 {
 Name: "MNO",
 Age: 30,
 Gender: "Male",
 City: "City",
 State: "State",
 
 }
 },
 a!sectionLayout(
 label: "",
 contents: {
 a!cardLayout(
 contents: {
 a!forEach(
 items: local!data,
 expression: a!columnsLayout(
 columns: {
 a!columnLayout(
 contents: {
 a!sideBySideLayout(
 items: {
 a!sideBySideItem(
 item: a!radioButtonField(
 choiceLabels: {
 ""
 },
 choiceValues: {
 true
 }
 ),
 width: "MINIMIZE"
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 value: {
 a!richTextItem(
 text: concat(
 "Name : ",
 fv!item.Name
 )
 ),
 char(
 10
 ),
 a!richTextItem(
 text: concat(
 "Age : ",
 fv!item.Name
 )
 ),
 char(
 10
 ),
 a!richTextItem(
 text: concat(
 "Gender: ",
 fv!item.Gender
 ) ),
 char(
 10
 ),
 a!richTextItem(
 text: concat(
 "City :",
 fv!item.City
 )),
 char(
 10
 ),
 a!richTextItem(
 text: concat(
 "State:",
 fv!item.City
 ))
 
 }
 )
 )
 }
 )
 }
 )
 }
 )
 )
 },
 height: "MEDIUM"
 )
 }
 )
) 
 Thanks 
 Madhu

How to show the results in fixed box

Top Replies