Interface recipes give you an opportunity to explore different interface design patterns. To learn how to directly use interface recipes within your interfaces, see Adapt an interface recipe to Work with My Applications.
Display checkboxes on a read-only paging grid to allow users to select multiple rows of data.
This recipe uses an employee data structure and objects created through the Use the Write to Data Store Entity Smart Service Function on an Interface recipe. Make sure that recipes has been built first in order to see data in this recipe.
This scenario demonstrates:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
=load(
/* Set the default paging and sorting config */
local!gridSelection: a!gridSelection(
selected: {},
pagingInfo: a!pagingInfo(
startIndex: 1,
batchSize: 10,
sort: a!sortInfo(
field: "lastName",
ascending: true
)
)
),
with(
local!datasubset: a!queryEntity(
entity:cons!EMPLOYEE_ENTITY,
query:a!query(
selection: a!querySelection(columns: {
a!queryColumn(field: "firstName"),
a!queryColumn(field: "lastName"),
a!queryColumn(field: "title")
}),
pagingInfo: local!gridSelection.pagingInfo
)
),
a!sectionLayout(
contents: {
a!gridField(
label: "Example: Employee Grid Selection",
totalCount: local!datasubset.totalCount,
columns: {
a!gridTextColumn(label: "First", field: "firstName", data: index(local!datasubset.data, "firstName" , {})),
a!gridTextColumn(label: "Last", field: "lastName", data: index(local!datasubset.data, "lastName" , {})),
a!gridTextColumn(label: "Title", field: "title", data: index(local!datasubset.data, "title" , {}))
},
identifiers: local!datasubset.identifiers,
value: local!gridSelection,
saveInto: {
local!gridSelection
},
selection: true
),
a!textField(
label: "Selected Employee IDs",
readOnly: true,
value: if(
length(local!gridSelection.selected) = 0,
"No employees selected",
joinarray(
local!gridSelection.selected,
", "
)
)
)
}
)
)
)
value
of the grid is gridSelection rather than pagingInfo, and the value that the grid returns when the user interacts with it is also a gridSelection. PagingInfo information is embedded in gridSelection.