Hi Team,
I am Self Learning appian and now creating interfaces, i want a requirement to create Repetitive Section Layout based on input integer value
Scenario is let a integer input vale named Number of clients count.
now i have collect the first Name, last Name and some other fields of clients, i created a CDT for those client data and created a Rule input as the interface is as shown below, when the number of client value is empty , we are displaying only one section layout as default.
When i entered 2 as number of client, i got 2 section layouts
how since i use for loop to display the recursive section layout, when i enter the details of first client , its is copied into second layout also
i tried using indexing , but i faced problem when i am inserting data into fields.
How do store Values into list type rule input in this situation.
please help me, Thanks in advance I am attaching code for review. let me know if I made any mistakes
{ a!cardLayout( contents: { a!columnsLayout( columns: { a!columnLayout( contents: { a!integerField( label: "No.of Clients:", labelPosition: "ABOVE", value: ri!NumberOfClients, saveInto: ri!NumberOfClients, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ) }, height: "AUTO", style: "TRANSPARENT", marginBelow: "STANDARD" ), a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!forEach( items: if(isnull(ri!NumberOfClients),1,1+enumerate(ri!NumberOfClients)), expression: { a!sectionLayout( label: "Client Data" & fv!index, contents: a!cardLayout( contents: { a!sectionLayout( contents: { a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Personal Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ) } ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "FirstName:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData.firstName), saveInto: ri!ClientData.firstName, refreshAfter: "UNFOCUS", validations: {} ), a!integerField( label: "Phone Number:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData),null, ri!ClientData[fv!index].phoneNumber), saveInto: { ri!ClientData[fv!index].phoneNumber, }, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "LastName:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].lastName), saveInto: ri!ClientData[fv!index].lastName, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "SSN:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null, ri!ClientData[fv!index].ssn), saveInto: ri!ClientData[fv!index].ssn, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!dateField( label: "Date of Birth:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].dob), saveInto: ri!ClientData[fv!index].dob, validations: {} ), a!textField( label: "Gender:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].gender), saveInto: ri!ClientData[fv!index].gender, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!sectionLayout( label: "", contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Address Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "AddressLine1:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].addressLine1), saveInto: ri!ClientData[fv!index].addressLine1, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "ZipCode:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].zipcode), saveInto: ri!ClientData[fv!index].zipcode, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "AddressLine2:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].addressLine2), saveInto: ri!ClientData[fv!index].addressLine2, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "State:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].state), saveInto: ri!ClientData[fv!index].state, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "City:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].city), saveInto: ri!ClientData[fv!index].city, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "Country:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData),null,ri!ClientData[fv!index].country), saveInto: ri!ClientData[fv!index].country, refreshAfter: "UNFOCUS", validations: {} ) } ) } ) } ) } ) ) } ), }
Discussion posts and replies are publicly visible
Try using Indexing with fv!item as it will help in Keep Tracking the Position and Index will help in storing Value at Proper Index will Handling Null Checks .
Hello ,
Thanks for the reply,
i tried using Indexing but no result
Within the a!sectionLayout for each client, use the current index (fv!index) to access and update the corresponding element in the ri!ClientData list.I have added below component code for your reference
a!sectionLayout
fv!index
ri!ClientData
a!textField( label: "FirstName:", labelPosition: "JUSTIFIED", value: ri!ClientData[fv!index].firstName, // Access by index saveInto: ri!ClientData[fv!index].firstName, refreshAfter: "UNFOCUS", validations: {} )
Hi Thank you Shubham , i tired this its throwing same error i posted earlier
Looping through ri!NumberOfClients without creating a list of ri!ClientData won't populate the grid view with individual client data.
ri!NumberOfClients
how to create list of ri!ClientData , any inputs how can i do that?
I am using ri!ClientData as map type data.(As i don't know the structure of your cdt). a!map( id:{}, addressLine1:{}, zipcode:{}, addressLine2:{}, state:{}, city:{}, country:{} )Observe Below Code and try to replicate for yours.{ a!cardLayout( contents: { a!columnsLayout( columns: { a!columnLayout( contents: { a!integerField( label: "No.of Clients:", labelPosition: "ABOVE", value: ri!NumberOfClients, saveInto:{ ri!NumberOfClients, a!save( ri!ClientData, a!forEach( items: enumerate(ri!NumberOfClients), expression: a!map( id:fv!index ) ) ) }, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ) }, height: "AUTO", style: "TRANSPARENT", marginBelow: "STANDARD" ), a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!forEach( items:ri!ClientData, expression: { a!sectionLayout( label: "Client Data" & fv!index, contents: a!cardLayout( contents: { a!sectionLayout( contents: { a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Personal Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ) } ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "FirstName:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData[fv!index].firstName),null,ri!ClientData[fv!index].firstName), saveInto: ri!ClientData[fv!index].firstName, refreshAfter: "UNFOCUS", validations: {} ), a!integerField( label: "Phone Number:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData[fv!index].phoneNumber),null, ri!ClientData[fv!index].phoneNumber), saveInto: { ri!ClientData[fv!index].phoneNumber, }, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "LastName:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].lastName),null,ri!ClientData[fv!index].lastName), saveInto: ri!ClientData[fv!index].lastName, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "SSN:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].ssn),null, ri!ClientData[fv!index].ssn), saveInto: ri!ClientData[fv!index].ssn, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!dateField( label: "Date of Birth:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].dob),null,ri!ClientData[fv!index].dob), saveInto: ri!ClientData[fv!index].dob, validations: {} ), a!textField( label: "Gender:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].gender),null,ri!ClientData[fv!index].gender), saveInto: ri!ClientData[fv!index].gender, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!sectionLayout( label: "", contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Address Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "AddressLine1:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].addressLine1),null,ri!ClientData[fv!index].addressLine1), saveInto: ri!ClientData[fv!index].addressLine1, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "ZipCode:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].zipcode),null,ri!ClientData[fv!index].zipcode), saveInto: ri!ClientData[fv!index].zipcode, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "AddressLine2:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].addressLine2),null,ri!ClientData[fv!index].addressLine2), saveInto: ri!ClientData[fv!index].addressLine2, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "State:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].state),null,ri!ClientData[fv!index].state), saveInto: ri!ClientData[fv!index].state, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "City:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].city),null,ri!ClientData[fv!index].city), saveInto: ri!ClientData[fv!index].city, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "Country:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].city),null,ri!ClientData[fv!index].country), saveInto: ri!ClientData[fv!index].country, refreshAfter: "UNFOCUS", validations: {} ) } ) } ) } ) } ) ) } ), }
{ a!cardLayout( contents: { a!columnsLayout( columns: { a!columnLayout( contents: { a!integerField( label: "No.of Clients:", labelPosition: "ABOVE", value: ri!NumberOfClients, saveInto:{ ri!NumberOfClients, a!save( ri!ClientData, a!forEach( items: enumerate(ri!NumberOfClients), expression: a!map( id:fv!index ) ) ) }, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ) }, height: "AUTO", style: "TRANSPARENT", marginBelow: "STANDARD" ), a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!forEach( items:ri!ClientData, expression: { a!sectionLayout( label: "Client Data" & fv!index, contents: a!cardLayout( contents: { a!sectionLayout( contents: { a!columnsLayout( columns: { a!columnLayout(contents: {}), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Personal Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ) } ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "FirstName:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData[fv!index].firstName),null,ri!ClientData[fv!index].firstName), saveInto: ri!ClientData[fv!index].firstName, refreshAfter: "UNFOCUS", validations: {} ), a!integerField( label: "Phone Number:", labelPosition: "JUSTIFIED", value:if(a!isNullOrEmpty(ri!ClientData[fv!index].phoneNumber),null, ri!ClientData[fv!index].phoneNumber), saveInto: { ri!ClientData[fv!index].phoneNumber, }, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "LastName:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].lastName),null,ri!ClientData[fv!index].lastName), saveInto: ri!ClientData[fv!index].lastName, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "SSN:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].ssn),null, ri!ClientData[fv!index].ssn), saveInto: ri!ClientData[fv!index].ssn, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!dateField( label: "Date of Birth:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].dob),null,ri!ClientData[fv!index].dob), saveInto: ri!ClientData[fv!index].dob, validations: {} ), a!textField( label: "Gender:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].gender),null,ri!ClientData[fv!index].gender), saveInto: ri!ClientData[fv!index].gender, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!sectionLayout( label: "", contents: { a!richTextDisplayField( labelPosition: "COLLAPSED", value: { a!richTextItem( text: { "Address Details" }, size: "MEDIUM_PLUS", style: { "STRONG" } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: "AddressLine1:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].addressLine1),null,ri!ClientData[fv!index].addressLine1), saveInto: ri!ClientData[fv!index].addressLine1, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "ZipCode:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].zipcode),null,ri!ClientData[fv!index].zipcode), saveInto: ri!ClientData[fv!index].zipcode, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "AddressLine2:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].addressLine2),null,ri!ClientData[fv!index].addressLine2), saveInto: ri!ClientData[fv!index].addressLine2, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "State:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].state),null,ri!ClientData[fv!index].state), saveInto: ri!ClientData[fv!index].state, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: "City:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].city),null,ri!ClientData[fv!index].city), saveInto: ri!ClientData[fv!index].city, refreshAfter: "UNFOCUS", validations: {} ), a!textField( label: "Country:", labelPosition: "JUSTIFIED", value: if(a!isNullOrEmpty(ri!ClientData[fv!index].city),null,ri!ClientData[fv!index].country), saveInto: ri!ClientData[fv!index].country, refreshAfter: "UNFOCUS", validations: {} ) } ) } ) } ) } ) ) } ), }
You Can try to Get an Insight Through This Set of Code .
a!localVariables( local!times: 1, local!data: a!forEach( items: enumerate(local!times) + 1, expression: { h1: "Personal Details", hc: { fn: "firstname", ln: "lastname", dob: "dateofbirth", pn: "phonenum", ssn: "ssn", gen: "gender" }, h2: "Addres Details", ad: { adl1: "address1", adl2: "address2", city: "city", zc: "aipcode", state: "state", country: "country" } } ), { a!dropdownField( choiceLabels: enumerate(4) + 1, choiceValues: enumerate(4) + 1, value: local!times, saveInto:{ a!save(local!times,if(a!isNullOrEmpty(local!times),1,local!times)) } , placeholder: "Select times" ), a!forEach( items: local!data, expression: { a!cardLayout( contents: { a!richTextDisplayField( value: a!richTextItem( text: concat("Client Data ", fv!index), color: "ACCENT", size: "MEDIUM_PLUS", style: "STRONG" ) ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(fv!item, "h1", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "fn", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "ln", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "dob", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "pn", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "ssn", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "hc", null), "gen", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(fv!item, "h2", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout(contents: {}), a!columnLayout(contents: {}) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(index(fv!item, "ad", null), "adl1", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "ad", null), "adl2", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "ad", null), "city", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ) } ), a!columnsLayout( columns: { a!columnLayout( contents: { a!textField( label: index(index(fv!item, "ad", null), "zc", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index(index(fv!item, "ad", null), "state", null), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ), a!columnLayout( contents: { a!textField( label: index( index(fv!item, "ad", null), "country", null ), labelPosition: "ABOVE", saveInto: {}, refreshAfter: "UNFOCUS", validations: {} ) } ) } ) } ) } ) } )
Hi,
create a local variable of type CDT and using repeat function create no of CDT and using local!clientdata[fv!index].firstName you can see the feilds holds the value.