RE: Dynamic Link

Question

Hi , 
 
 I am trying to implement: On Click of Dynamic Link displaying one Grid, But AS per the requirement This needs to be displayed as side By side, 
 As of Now On click of Link the grid is displaying but How would I make side By side grid, Since grid has box Layout and Grid Field ,Ui is throwing error . 
 How would I make change in this code -On click of link grid has to be displayed. 
 a!localVariables(
 local!priority: false(),
 {
 a!linkField(
 /*label: "Link Field",*/
 links: {
 a!dynamicLink(
 label: "Audit History",
 value: local!priority,
 saveInto: a!save(local!priority, true())
 )
 }
 ),
 a!sectionLayout(
 contents: {
 rule!CR_APP_SC_auditDetails(
 cif_int: ri!cif_int,
 sectionName_txt: cons!CR_APP_TXT_AUDIT_SECTION_NAMES[1]
 )
 },
 showWhen: local!priority
 )
 }
)

Stefan Helzle · Answer

Use the showWhen parameter in the section layout.

Prasanta Paul · Answer

By using cardLayout.

Prasanta Paul · Answer

Like that by using cardLayout

Prasanta Paul · Answer

a!localVariables(
 local!startIndex: 1,
 local!batchSize: 6,
 local!id,
 local!firstName,
 local!contact,
 local!country,
 local!city,
 local!isActive: true,
 local!dbData: rule!UMS_Generic_getQryRecordData(
 recordType: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details',
 fields: {
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{b35cd88d-8566-44ab-af99-51d52fb2111b}firstName',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{0fe119e6-d63e-4fa5-a7f8-5ecda8f844ee}lastName',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.relationships.{9fea36ce-6c59-4c3d-b07c-8e9c5c134cf5}refTitle.fields.{e208725c-06d3-4a5c-85f3-5eb665c583df}title',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{8aa5c11e-b2f6-4449-9fb2-5320829bbd12}contactNumber',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{1b594dfb-1633-48a1-8d49-ffa7645193a5}country',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{0c1d8c3f-dae9-40c6-9b5b-c5d27375bb3b}city',
 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive'
 },
 filters: {
 a!queryFilter(
 field: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{b35cd88d-8566-44ab-af99-51d52fb2111b}firstName',
 operator: "includes",
 value: local!firstName,
 applyWhen: if(
 rule!UMS_GBL_isBlank(local!firstName),
 false,
 true
 )
 ),
 a!queryFilter(
 field: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive',
 operator: "=",
 value: local!isActive,
 applyWhen: if(
 rule!UMS_GBL_isBlank(local!isActive),
 false,
 true
 )
 ),
 a!queryFilter(
 field: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{8aa5c11e-b2f6-4449-9fb2-5320829bbd12}contactNumber',
 operator: "includes",
 value: local!contact,
 applyWhen: if(
 rule!UMS_GBL_isBlank(local!contact),
 false,
 true
 )
 ),
 a!queryFilter(
 field: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{1b594dfb-1633-48a1-8d49-ffa7645193a5}country',
 operator: "includes",
 value: local!country,
 applyWhen: if(
 rule!UMS_GBL_isBlank(local!country),
 false,
 true
 )
 ),
 a!queryFilter(
 field: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{0c1d8c3f-dae9-40c6-9b5b-c5d27375bb3b}city',
 operator: "includes",
 value: local!city,
 applyWhen: if(
 rule!UMS_GBL_isBlank(local!city),
 false,
 true
 )
 )
 },
 fetchTotalCount: true,
 pagingInfo: a!pagingInfo(
 startIndex: local!startIndex,
 batchSize: local!batchSize
 )
 ),
 local!totalRows: index(local!dbData, "totalCount", 0),
 local!data: index(local!dbData, "data", null),
 local!showEmail: 0,
 local!iscollapsed: true, 
 a!headerContentLayout(
 header:a!cardLayout(
 contents: a!sideBySideLayout(
 items: {
 a!sideBySideItem(
 item: a!richTextDisplayField(
 label: "",
 labelPosition: "COLLAPSED",
 value: a!richTextItem(
 text: "User Management System",
 size: "MEDIUM_PLUS",
 style: "STRONG"
 ),
 align: "CENTER"
 )
 ),
 a!sideBySideItem(
 item: a!recordActionField(
 actions: a!recordActionItem(
 action: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.actions.{fa126bda-87c3-4ccd-bedc-7c87e66204c4}createUser',
 identifier: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id'
 ),
 style: "TOOLBAR_PRIMARY",
 display: "LABEL_AND_ICON"
 ),
 width: "MINIMIZE"
 ),
 a!sideBySideItem(
 item: a!recordActionField(
 actions: a!recordActionItem(
 action: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.actions.{d7f75429-99eb-4495-b44c-f64e994746b8}createBulkUsers',
 identifier: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id'
 ),
 style: "TOOLBAR_PRIMARY",
 display: "LABEL_AND_ICON"
 ),
 width: "MINIMIZE"
 )
 },
 showWhen: a!isNullOrEmpty(local!id),
 marginAbove: "LESS",
 stackWhen: {

 }
 ),
 style: "INFO",
 showBorder:false,
 showShadow: true,
 ),
 contents: a!cardLayout(
 contents: {
 /* Header and Action */
 a!columnsLayout(
 columns: {
 a!columnLayout(
 contents: {
 a!boxLayout(
 label: rule!UMS_Rule_getDynamicLabelName(
 headerName: if(
 local!isActive = true,
 "List of Active Users",
 "List of In-active Users"
 ),
 map: {
 a!map(key: "First Name", value: local!firstName),
 a!map(key: "Contact", value: local!contact),
 a!map(key: "City", value: local!city),
 a!map(key: "Country", value: local!country)
 }
 ),
 contents: {
 a!sideBySideLayout(
 items: {
 a!sideBySideItem(
 item: a!textField(
 placeholder: "--- First Name ---",
 value: local!firstName,
 saveInto: { local!firstName }
 )
 ),
 a!sideBySideItem(
 item: a!textField(
 placeholder: "--- Contact No.---",
 value: local!contact,
 saveInto: { local!contact },
 align: "LEFT"
 )
 ),
 a!sideBySideItem(
 item: a!dropdownField(
 choiceLabels: { "ENGLAND", "INDIA", "USA" },
 choiceValues: { "ENG", "IND", "USA" },
 placeholder: "--- Country ---",
 value: local!country,
 saveInto: { local!country }
 )
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 label: " ",
 labelPosition: "ABOVE",
 value: {
 a!richTextIcon(
 icon: "times-circle",
 caption: "Clear filters",
 link: a!dynamicLink(
 label: "Clear Filters",
 saveInto: {
 a!save(local!firstName, null),
 a!save(local!contact, null),
 a!save(local!country, null),
 a!save(local!city, null)
 }
 ),
 linkStyle: "STANDALONE",
 color: "NEGATIVE",
 size: "MEDIUM_PLUS"
 )
 },
 align: "RIGHT"
 ),
 width: "MINIMIZE",
 showWhen: or(
 a!isNotNullOrEmpty(local!contact),
 a!isNotNullOrEmpty(local!firstName),
 a!isNotNullOrEmpty(local!country),
 a!isNotNullOrEmpty(local!city)
 )
 ),
 a!sideBySideItem(
 item: a!buttonArrayLayout(
 buttons: {
 a!buttonWidget(
 label: "In active",
 value: true,
 saveInto: { a!save(local!isActive, save!value) },
 submit: true,
 style: "SOLID",
 color: "#db4925",
 showWhen: local!isActive = false
 ),
 a!buttonWidget(
 label: "Active",
 value: false,
 saveInto: { a!save(local!isActive, save!value) },
 submit: true,
 style: "SOLID",
 color: cons!UMS_TXT_SITE_BUTTONS_COLOR,
 showWhen: local!isActive = true
 )
 },
 marginAbove: "NONE",
 marginBelow: "NONE"
 ),
 width: "MINIMIZE"
 ),
 a!sideBySideItem(item: {})
 },
 showWhen: a!isNullOrEmpty(local!id)
 ),
 a!sectionLayout(
 contents: {
 a!columnsLayout(
 columns: {
 a!columnLayout(
 contents: {
 a!forEach(
 items: local!data,
 expression: {
 a!cardLayout(
 contents: {
 a!sideBySideLayout(
 items: {
 a!sideBySideItem(
 item: a!imageField(
 images: a!userImage(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{4e54243c-7635-4985-b356-62e10810c0c2}userName']
 ),
 size: "ICON_PLUS",
 style: "AVATAR"
 ),
 width: "MINIMIZE"
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 value: {
 a!richTextItem(
 text: proper(
 concat(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{b35cd88d-8566-44ab-af99-51d52fb2111b}firstName'],
 " ",
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{0fe119e6-d63e-4fa5-a7f8-5ecda8f844ee}lastName']
 )
 ),
 color: cons!UMS_TXT_FIELD_VALUE_COLOR,
 style: "STRONG"
 ),
 char(32),
 a!richTextIcon(
 icon: if(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive'],
 "check-circle",
 "times-circle"
 ),
 color: if(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive'],
 "POSITIVE",
 "NEGATIVE"
 )
 ),
 char(10),
 a!richTextItem(
 text: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.relationships.{9fea36ce-6c59-4c3d-b07c-8e9c5c134cf5}refTitle.fields.{e208725c-06d3-4a5c-85f3-5eb665c583df}title'],
 color: "SECONDARY",
 style: "EMPHASIS"
 )
 }
 )
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 value: {
 a!richTextIcon(icon: "envelope", color: "SECONDARY"),
 char(32),
 a!richTextItem(text: "Email ID.", color: "SECONDARY"),
 char(10),
 a!richTextItem(
 text: if(
 a!isNullOrEmpty(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email']
 ),
 "N/A",
 if(
 local!showEmail = fv!index,
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email'],
 concat(
 left(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email'],
 5
 ),
 "***"
 )
 )
 ),
 color: cons!UMS_TXT_FIELD_VALUE_COLOR,
 style: "EMPHASIS"
 ),
 char(32),
 a!richTextIcon(
 icon: "eye",
 link: a!dynamicLink(
 saveInto: { a!save(local!showEmail, fv!index) }
 ),
 linkStyle: "STANDALONE",
 showWhen: and(
 local!showEmail <> fv!index,
 a!isNotNullOrEmpty(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email']
 )
 )
 ),
 a!richTextIcon(
 icon: "eye-slash",
 link: a!dynamicLink(saveInto: { a!save(local!showEmail, 0) }),
 linkStyle: "STANDALONE",
 showWhen: and(
 local!showEmail = fv!index,
 a!isNotNullOrEmpty(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{6ad75d4a-baad-46ca-b50f-8ef672e00eab}email']
 )
 )
 )
 }
 )
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 value: {
 a!richTextIcon(icon: "phone", color: "SECONDARY"),
 char(32),
 a!richTextItem(text: "Phone No.", color: "SECONDARY"),
 char(10),
 a!richTextItem(
 text: if(
 a!isNotNullOrEmpty(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{8aa5c11e-b2f6-4449-9fb2-5320829bbd12}contactNumber']
 ),
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{8aa5c11e-b2f6-4449-9fb2-5320829bbd12}contactNumber'],
 "N/A"
 ),
 color: cons!UMS_TXT_FIELD_VALUE_COLOR
 )
 }
 )
 ),
 a!sideBySideItem(
 item: a!richTextDisplayField(
 value: {
 a!richTextItem(text: "Country", color: "SECONDARY"),
 char(10),
 a!richTextImage(
 image: a!documentImage(
 document: rule!UMS_Flag_Icon(
 flag: tostring(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{1b594dfb-1633-48a1-8d49-ffa7645193a5}country']
 )
 )
 )
 ),
 char(32),
 a!richTextItem(
 text: upper(
 left(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{1b594dfb-1633-48a1-8d49-ffa7645193a5}country'],
 3
 )
 ),
 color: cons!UMS_TXT_FIELD_VALUE_COLOR
 )
 }
 )
 ),
 a!sideBySideItem(
 item: a!localVariables(
 local!userDetails: {
 index(
 rule!UMS_getUserDetailsById(
 userId: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id']
 ),
 "data",
 null
 )
 },
 local!fields: remove(
 a!keys(local!userDetails[1]),
 { 9, 10, 11, 12, 13, 14, 15, 16, 23 }
 ),
 local!finalLength: length(
 reject(
 fn!isnull,
 a!flatten(
 a!forEach(
 items: local!userDetails,
 expression: a!localVariables(
 local!item: fv!item,
 a!forEach(
 items: local!fields,
 expression: if(
 rule!UMS_GBL_isBlank(local!item[fv!item]),
 fv!item,
 null
 )
 )
 )
 )
 )
 )
 ),
 local!fullLength: length(local!fields),
 local!remainingLength: local!fullLength - local!finalLength,
 a!progressBarField(
 label: "Profile Strength",
 percentage: (local!remainingLength / local!fullLength) * 100,
 color: if(
 local!remainingLength = 19,
 "POSITIVE",
 if(
 local!remainingLength < 10,
 "NEGATIVE",
 "WARN"
 )
 ),
 style: "THIN"
 )
 )
 ),
 a!sideBySideItem(item: {}),
 a!sideBySideItem(
 item: a!recordActionField(
 actions: a!recordActionItem(
 action: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.actions.{9c49781a-4cc9-4713-8c90-2c74f61b885c}updateUser',
 identifier: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id']
 ),
 style: "TOOLBAR_PRIMARY",
 display: "ICON",
 align: "END",
 showWhen: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive'] = true
 ),
 width: "MINIMIZE"
 ),
 a!sideBySideItem(
 item: if(
 fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{91c19193-454f-4af3-97f6-9916a1102284}isActive'] = true(),
 a!recordActionField(
 actions: a!recordActionItem(
 action: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.actions.{19784b46-50d8-4323-9f01-f7cb7c5614be}deactivateUser',
 identifier: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id']
 ),
 style: "TOOLBAR_PRIMARY",
 display: "ICON"
 ),
 a!recordActionField(
 actions: a!recordActionItem(
 action: 'recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.actions.{7c73aa57-2418-4776-877b-b5c62a857c39}reactivateUser',
 identifier: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id']
 ),
 style: "TOOLBAR_PRIMARY",
 display: "ICON"
 )
 ),
 width: "MINIMIZE"
 )
 }
 )
 },
 link: a!dynamicLink(
 value: fv!item['recordType!{3c52c22d-0c16-4f4e-9b24-f1eb28cfbe03}UMS User Details.fields.{963012ef-703b-45ee-a2af-4d9c95ab489f}id'],
 saveInto: a!save(local!id, save!value)
 ),
 shape: "ROUNDED",
 marginBelow: "STANDARD",
 showBorder: false(),
 showShadow: true()
 )
 }
 ),
 rule!UMS_UI_Custom_Pagination(
 startIndex: local!startIndex,
 batchSize: local!batchSize,
 totalRows: local!totalRows,
 align: "RIGHT"
 )
 },
 width: "AUTO"
 )
 },
 marginBelow: "MORE"
 )
 },
 showWhen: a!isNullOrEmpty(local!id),
 marginBelow: "NONE"
 ),

 },
 showWhen: a!isNullOrEmpty(local!id),
 style: rule!UMS_D_colorCode(color: "Banner Color"),
 shape: "ROUNDED",
 showBorder: false,
 padding: "NONE",


 )
 },
 width: if(
 local!iscollapsed = true,
 "AUTO",
 "WIDE_PLUS"
 )
 ),
 a!columnLayout(
 contents: rule!UMS_UI_EventHistoryVersion(collapsed: local!iscollapsed),
 width: if(
 local!iscollapsed = true,
 "EXTRA_NARROW",
 "MEDIUM_PLUS"
 ),
 showWhen: a!isNullOrEmpty(local!id)
 )
 },
 marginAbove: "NONE",
 marginBelow: "NONE",

 ),
 a!sectionLayout(
 contents: rule!UMS_UI_UserSummaryDashboard(userId: local!id),
 showWhen: a!isNotNullOrEmpty(local!id),
 marginAbove: "NONE",
 marginBelow: "NONE"
 ),
 if(
 rule!UMS_rule_hasValue(local!id),
 null,
 rule!UMS_UI_Footer()
 )
 },
 showBorder: false,
 showShadow: true
 ),
 isHeaderFixed: true
 )
)