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 ) } )
Discussion posts and replies are publicly visible
You can use two columns, keep the showWhen and adjust the width of the column. Maybe it will be helpful.
No User doesn't want that ,
By Any chance can we convert this code to side By Side items?
a!boxLayout( label: cons!CR_APP_LAB_AUDIT_DETAILS[1], isCollapsible: true(), isInitiallyCollapsed: true(), marginBelow: "STANDARD", contents: { a!gridField( spacing: "DENSE", height: "AUTO", shadeAlternateRows: true(), data: local!data, pageSize: 10, initialSorts: a!sortInfo(field: "createdOn_dt", ascending: false()), columns: { a!gridColumn( /*label: cons!CR_APP_LAB_AUDIT_DETAILS[3],*/ value: rule!CR_APP_RT_displayAuditStatusIcon(rowStatus_txt: fv!row.rowStatus_txt), width: "ICON", align: "START" ), a!gridColumn( label: cons!CR_APP_LAB_AUDIT_DETAILS[2], value: rule!CR_APP_DSC_mapAuditSectionNames( sectionName_txt: index(fv!row, "sourceName_txt", tostring(null)) ), width: "AUTO", align: "START" ), a!gridColumn( label: cons!CR_APP_LAB_AUDIT_DETAILS[4], value: rule!CR_FN_nbfDateTimeFormat(input: fv!row.createdOn_dt), width: "AUTO", align: "START" ), a!gridColumn( label: cons!CR_APP_LAB_AUDIT_DETAILS[5], value: rule!APN_FN_getDisplayName( userId: index(fv!row, "createdBy_txt", tostring(null)) ), width: "AUTO", align: "START" ), a!gridColumn( label: cons!CR_APP_LAB_AUDIT_DETAILS[6], value: if( rule!APN_isBlank(fv!row.createdBy_txt), tostring(null), if( isusernametaken(fv!row.createdBy_txt, ), if( user(fv!row.createdBy_txt, "status"), if( not(isnull(fv!row.updatedByRole_txt)), fv!row.updatedByRole_txt, rule!CR_FN_getUserRole(inputUser_txt: fv!row.createdBy_txt) ), tostring(null) & "User deactivated" ), tostring(null) ) ), width: "AUTO", align: "START" ), a!gridColumn( label: cons!CR_APP_LAB_AUDIT_DETAILS[7], value: if( rule!APN_isBlank(fv!row.description_txt), null, a!richTextDisplayField( value: a!richTextBulletedList( items: reject( fn!isnull, split(fv!row.description_txt, char(13)) ) ) ) ), width: "AUTO", align: "START" ) } ) } )
local!data: a!refreshVariable( value:rule!CR_APP_QE_getAppAuditBasedOnFilters( cif_int: ri!cif_int, rowId_int: index( ri!crAPPCollateralSelected_cdt, "id_int", tointeger(null) ), requestId_int: ri!requestId_int, sectionName_txt: ri!sectionName_txt, pagingInfo: a!pagingInfo(1,-1) ).data, refreshAlways: true() )
can we do some how by removing box Layout and grid Field ,using on click of dynamic link it has to show as side by side only?
You can use customize grid.
I think Customized grid is nothing but Grid Field right? IIf So we have already making use of GridField
By using cardLayout.
Like that by using cardLayout
Can u please send sample snippet for this or for above mentioned code?
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 ) )