Filter the records

Hello Purvaja, 

You can achieve this as a tab format in a single page instead of going for multiple pages in site.

If you are willing to do this, create a wrapper interface with required no of card layouts which are clickable links. Create a child interfaces for each page. Call these child interfaces on click of the specific tab which you are pointing to.

This would work,

Thanks for the reply vinayp0002

Can we achieve to filter on all the pages at a time? 

Yes purib0002, we can achieve to filter on all the tabs as we pass the filter from the wrapper interface to the child interfaces...

" create a wrapper interface with required no of card layouts which are clickable links. Create a child interfaces for each page. "

  Can you please provide the example of this implementation, vinayp0002 ?

Hello purib0002, 

Please have a look at the example: 

a!localVariables(
local!tab: 1,
local!action: null,
local!link: true(),
local!exampleId,
local!exampleName,
{
a!billboardLayout(
backgroundMedia: a!documentImage(document: cons!DOCVIEWER[2]),
backgroundColor: "#f0f0f0",
showWhen: or(local!link, local!action = "cancel"),
overlay: a!barOverlay(
contents: {
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!richTextDisplayField(
value: {
a!richTextItem(
text: "Hello " & loggedInUser() ,
size: "MEDIUM_PLUS"
)
}
)
}
),
a!columnLayout(
contents: {
a!richTextDisplayField(
value: {
a!richTextIcon(icon: "database", size: "MEDIUM_PLUS"),
char(9),
a!richTextItem(
text: "Example",
size: "MEDIUM_PLUS"
)
},
align: "RIGHT"
)
}
)
}
)
}
)
),
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!cardLayout(
contents: {
a!richTextDisplayField(
label: " ",
value: {
a!richTextIcon(
icon: "file-text",
color: "ACCENT",
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(text: "Page 1", size: "MEDIUM_PLUS")
},
align: "CENTER"
)
},
link: a!dynamicLink(
value: 1,
saveInto: local!tab
),
style: if(
local!tab = 1,
"ACCENT",
"STANDARD"
)
)
}
),
a!columnLayout(
contents: {
a!cardLayout(
contents: {
a!richTextDisplayField(
label: " ",
value: {
a!richTextIcon(
icon: "files-o",
color: "ACCENT",
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(text: "Page 2", size: "MEDIUM_PLUS")
},
align: "CENTER"
)
},
link: a!dynamicLink(
value: 2,
saveInto: local!tab
),
style: if(
local!tab = 2,
"ACCENT",
"STANDARD"
)
)
}
),
a!columnLayout(
contents: {
a!cardLayout(
contents: {
a!richTextDisplayField(
label: " ",
value: {
a!richTextIcon(
icon: "handshake-o",
color: "ACCENT",
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(text: "Page 3", size: "MEDIUM_PLUS")
},
align: "CENTER"
)
},
link: a!dynamicLink(
value: 3,
saveInto: local!tab
),
style: if(
local!tab = 3,
"ACCENT",
"STANDARD"
)
)
}
),
a!columnLayout(
contents: {
a!cardLayout(
contents: {
a!richTextDisplayField(
label: " ",
value: {
a!richTextIcon(
icon: "gears",
color: "ACCENT",
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(text: "Page 4", size: "MEDIUM_PLUS")
},
align: "CENTER"
)
},
link: a!dynamicLink(
value: 4,
saveInto: local!tab
),
style: if(
local!tab = 4,
"ACCENT",
"STANDARD"
)
)
}
),
a!columnLayout(
contents: {
a!cardLayout(
contents: {
a!richTextDisplayField(
label: " ",
value: {
a!richTextIcon(
icon: "newspaper-o",
color: "ACCENT",
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(text: "Page 5", size: "MEDIUM_PLUS")
},
align: "CENTER"
)
},
link: a!dynamicLink(
value: 5,
saveInto: local!tab
),
style: if(
local!tab = 5,
"ACCENT",
"STANDARD"
)
)
}
)
},
showWhen: or(local!link, local!action = "cancel")
),
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!textField(
label: "Example ID",
labelPosition: "ABOVE",
placeholder: "Search by Example Id",
value: local!exampleId,
saveInto: local!exampleId
),
a!linkField(
label: " ",
links: a!dynamicLink(
label: "clear Filters",
saveInto: {
a!save(local!exampleId, null),
a!save(local!exampleName, null)
}
)
)
}
),
a!columnLayout(
contents: {
a!dropdownField(
label: "Example Name",
labelPosition: "ABOVE",
placeholder: "Search by Example Name",
value: local!exampleName,
saveInto: local!exampleName
)
}
)
}
),
choose(
local!tab,
{
a!cardLayout(
contents: rule!Child_Filter(
exampleId: local!exampleId,
exampleName: null,
materiality: null,
currentAssignee: null,
statusSince: null
),
showWhen: or(local!link, local!action = "cancel")
)
},
{
a!cardLayout(
contents: rule!Child_Filter_2(
exampleId: local!exampleId,
exampleName: null,
materiality: null,
currentAssignee: null,
statusSince: null
),
showWhen: or(local!link, local!action = "cancel")
)
},
{},
{},
{}
)
}
)

Thank you vinayp0002.

This is really helpful.

I have a small doubt, We have a child interface in the card layout right. When I select name from the dropdown in the main interface, how can filter the child interface(having rule inputs) with the readonly grid. 

Purvaja, 

As you filter in the parent interface, the filtered value will be passed on to the child interfaces and that is used as parameter for the data you query for the read only grid.

Record data is not getting filtered based on the id selected in the dropdown. 

Please check whether you are passing correct parameter into the right filter..

yes.

In the parent interface, you are passing name for id.

Please check which data is going into the query entity which you hit in the read only grid in the child interface.

In the parent interface, you are passing name for id.

Please check which data is going into the query entity which you hit in the read only grid in the child interface.