Expression for actualize the specific interface

Question

Hi, 
 We are planning to develop an interface to actualize the functions in the attached file,

but we are not sure if Appian can actualize those functions. 
 If it dose , may you tell us the expressions? 
 Best regards

venkyuppala09 · Answer

Hi, Did slight modifications to above answers, hope this code exactly suits for your requirement. a!localVariables(
 local!data: {
 {
 number: 1,
 name: "Aaa",
 value: 123,
 status: "good"
 }
 },
 a!gridLayout(
 headerCells: {
 a!gridLayoutHeaderCell(label: "Number"),
 a!gridLayoutHeaderCell(label: "Name"),
 a!gridLayoutHeaderCell(label: "Value"),
 a!gridLayoutHeaderCell(label: "Status"),
 a!gridLayoutHeaderCell(label: "Operation"),
 
 },
 rows: a!forEach(
 items: local!data,
 expression: a!gridRowLayout(
 id: fv!index,
 contents: {
 a!textField(readOnly: false, value: fv!item.number),
 a!textField(readOnly: false, value: fv!item.name),
 a!textField(readOnly: false, value: fv!item.value),
 a!textField(readOnly: false, value: fv!item.status),
 a!buttonArrayLayout(
 buttons: {
 a!buttonWidget(
 label: "Add a blank row upon",
 size: "SMALL",
 saveInto: {
 a!save(local!data, append(local!data, null))
 }
 ),
 a!buttonWidget(
 label: "Copy the data to next row",
 size: "SMALL",
 saveInto: {
 a!save(
 local!data,
 insert(local!data, fv!item, fv!index + 1)
 )
 }
 )
 }
 )
 }
 )
 )
 )
)

Joshua F · Answer

a!localVariables(
 local!data: {
 {
 number: 1,
 name: "Aaa",
 value: 123,
 status: "good"
 }
 },
 a!gridLayout(
 headerCells: {
 a!gridLayoutHeaderCell(label: "Number"),
 a!gridLayoutHeaderCell(label: "Name"),
 a!gridLayoutHeaderCell(label: "Value"),
 a!gridLayoutHeaderCell(label: "Status"),
 a!gridLayoutHeaderCell(label: "Operation"),
 
 },
 rows: a!forEach(
 items: local!data,
 expression: a!gridRowLayout(
 id: fv!index,
 contents: {
 a!textField(readOnly: true, value: fv!item.number),
 a!textField(readOnly: true, value: fv!item.name),
 a!textField(readOnly: true, value: fv!item.value),
 a!textField(readOnly: true, value: fv!item.status),
 a!richTextDisplayField(
 value: {
 a!richTextIcon(
 icon: "plus",
 linkStyle: "STANDALONE",
 link: a!dynamicLink(
 value: fv!item,
 saveInto: a!save(
 local!data,
 append(local!data, save!value)
 )
 )
 ),
 a!richTextItem(
 text: " Add a row",
 linkStyle: "STANDALONE",
 link: a!dynamicLink(
 value: fv!item,
 saveInto: a!save(
 local!data,
 append(local!data, save!value)
 )
 )
 )
 }
 )
 }
 )
 )
 )
) 
 This should get you on the right path. 
 I used an editable grid with the data based on a local dictionary of data. The magic happens in the save into on the rich text objects. I am using a dynamic link to to append the data used to populate the grid. I am sure this is not 100% what you need but it should get you familiar enough with the design concepts to build out according to your own use case.

Naresh · Answer

Hi you can try this code, it will work for your use case. Replace local!data with your CDT. 
 a!localVariables(
 /*Consider this is your CDT*/
 local!data: {
 a!map( id:null, name: null , value: null , status: null , operation: null),
 },
 local!index,
 {
 a!gridLayout(
 totalCount: count(local!data),
 headerCells: {
 a!gridLayoutHeaderCell(label: "No" ),
 a!gridLayoutHeaderCell(label: "Name" ),
 a!gridLayoutHeaderCell(label: "Value" ),
 a!gridLayoutHeaderCell(label: "Status" ),
 a!gridLayoutHeaderCell(label: "Operation", align: "RIGHT" ),
 a!gridLayoutHeaderCell(label: "" )
 },
 columnConfigs: {
 a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight:1 ),
 a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight:3 ),
 a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight:3 ),
 a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight:3 ),
 a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight:2 ),
 a!gridLayoutColumnConfig(width: "ICON")
 },
 rows: a!forEach(
 items: local!data,
 expression: a!gridRowLayout(
 contents: {
 a!textField(
 label: "no " & fv!index,
 value: fv!item.id,
 saveInto: fv!item.id,
 required: true
 ),
 a!textField(
 label: "name " & fv!index,
 value: fv!item.name,
 saveInto: fv!item.name,
 required:true
 ),
 a!integerField(
 label: "value " & fv!index,
 value: fv!item.value,
 saveInto: fv!item.value,
 required:true
 ),
 a!textField(
 label: "status " & fv!index,
 value: fv!item.status,
 saveInto: fv!item.status
 ),
 a!dateField(
 label: "start date " & fv!index,
 value: fv!item.operation,
 saveInto: fv!item.operation,
 required:true,
 align: "RIGHT"
 ),
 /* For the Removal Column*/
 a!richTextDisplayField(
 value: a!richTextIcon(
 icon: "close",
 altText: "delete " & fv!index,
 caption: "Remove " & fv!item.name,
 link: a!dynamicLink(
 value: fv!index,
 saveInto: {
 a!save(local!data, remove(local!data, save!value))
 }
 ),
 linkStyle: "STANDALONE",
 color: "NEGATIVE"
 )
 )
 },
 id: fv!index
 )
 ),
 addRowlink: a!dynamicLink(
 label: "Add New Row",
 value: {
 /*You need to call your CDT here*/
 operation: if(
 a!isNullOrEmpty(local!data),
 null,
 if(
 length(local!data) > 2,
 index(local!data[length(local!data)], "operation", null),
 index(local!data[1], "operation", null)
 )
 )
 },
 saveInto: {
 a!save(local!data, append(local!data, save!value))
 }
 ),
 rowHeader: 1
 )
 }
)

Expression for actualize the specific interface

Top Replies