Hello.
I am trying to implement a contact card row format in my sharepoint, as it can be seen by searching SharePoint Contact Card Format.
The code that should make the columns Email and Phone appear is this one:
{"elmType": "span","txtContent": "[$Email]","style": {"display": "=if([$Email] == '', 'none', 'block')",
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
},This code works for other columns such as Brand and Product_Ref, which have exactly the same column parameters as the Email column. The Phone column does not have the same parameters, as it is filled by numbers.
The complete code used is the following. As you will see, the display of the Email and Phone columns is on "block", but it isn't displayed.
{"schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json","hideSelection": true,"hideColumnHeader": true,"rowFormatter": {"_comment_": "_________________LINHA____________________","elmType": "div","style": {"display": "flex","flex-wrap": "wrap","align-items": "stretch","padding": "8px","margin-bottom": "16px","max-width": "930px","border-radius": "8px","box-shadow": "4px 4px 8px darkgrey"
},"attributes": {"class": "ms-bgColor-neutralLighter"
},"children": [
{"_comment_": "_____________________COLUNA 1_______________","elmType": "div","style": {"flex-grow": "1","display": "flex","flex-wrap": "wrap","align-items": "stretch","max-width": "310px"
},"children": [
{"_comment_": "_____________________FIELD - container ________________","elmType": "div","style": {"width": "400px","height": "200px","border-radius": "10%","margin": "5px","text-align": "center"
},"children": [
{"_comment_": "_____________________imagem________________","elmType": "img","attributes": {"src": "=if([$IdentificationImage] == '', @currentWeb + '/_layouts/15/userphoto.aspx?size=M', [$IdentificationImage])","title": "=if([$IdentificationImage] == '', 'No picture available', [$IdentificationImage.desc])"
},"style": {"max-width": "100%","max-height": "95%","vertical-align": "middle","margin-top": "5%","margin-bottom": "5%"
}
}
]
}
]
},
{"_comment_": "_____________________COLUNA 2_______________","elmType": "div","style": {"flex-grow": "1","display": "flex","flex-wrap": "wrap","align-items": "stretch","max-width": "200px","flex-direction": "column"
},"children": [
{"_comment_": "_____________________COLUNA 2 linhas topo_______________","elmType": "div","style": {"flex-grow": "1"
},"children": [
{"_comment_": "_____________________COLUNA 2 conteudo_______________","elmType": "span","txtContent": "[$Title]","style": {"display": "block"
},"attributes": {"class": "ms-fontSize-l ms-fontWeight-semibold ms-fontColor-neutralPrimary"
}
},
{"elmType": "span","txtContent": "[$Product_Reference]","style": {"display": "=if([$Product_Reference] == '', 'none', 'block')"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
},
{"elmType": "span","txtContent": "[$Brand]","style": {"display": "=if([$Brand] == '', 'none', 'block')"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
},
{"elmType": "span","txtContent": "[$Email]","style": {"display": "block","comment": "Quando se mete o if aqui não funciona"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
},
{"elmType": "span","txtContent": "[$Contact-Email_2]","style": {"display": "block","comment": "Quando se mete o if aqui não funciona"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
},
{"elmType": "span","txtContent": "[$Phone]","style": {"display": "block","comment": "Quando se mete o if aqui não funciona"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
}
]
},
{
"elmType": "div","style": {"flex-grow": "1","display": "flex","flex-direction": "row","flex-wrap": "wrap","align-items": "flex-end"
},"children": [
{"elmType": "a","style": {"display": "=if([$Website] == '', 'none', 'block')","width": "100%"
},"attributes": {"class": "ms-fontSize-xs ms-fontWeight-regular ms-fontColor-neutralPrimary ms-fontColor-themePrimary--hover","href": "=[$Website]"
},"children": [
{"elmType": "span","attributes": {"iconName": "Website","class": "ms-fontColor-themePrimary"
},"style": {"padding-right": "6px"
}
},
{"elmType": "span","txtContent": "[$Website]"
}
]
}
]
}
]
},
{"_comment_": "_____________________COLUNA 3_______________","elmType": "div","style": {"flex-grow": "1","display": "flex","flex-wrap": "wrap","align-items": "stretch","max-width": "200px","flex-direction": "column"
},"children": [
{"_comment_": "_____________________COLUNA 3 linhas topo_______________","elmType": "div","style": {"flex-grow": "1"
},"children": [
{"_comment_": "_____________________COLUNA 3 conteudo_______________","elmType": "span","txtContent": "[$Description]","style": {"display": "=if([$Description] == '', 'none', 'block')"
},"attributes": {"class": "ms-fontSize-m ms-fontWeight-regular ms-fontColor-neutralSecondary"
}
}
]
}
]
}
]
}
}