Forum Discussion
Inline Editing On Person Fields
Hi guys,
I am trying to implement the Inline Editing on a Person/Group Field.
I am using this condition.
{
"elmType": "div",
"inlineEditField": "[$Pessoa]",
"txtContent": "@currentField"
}
And it works! I can edit inline.
Thing is it doesnt show me the person name, it shows [Object Object]
Any solution?
Thanks in advance
- jherskoCopper Contributor
jsantos489 Give this a try.
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "inlineEditField": "[$fieldName]", "txtContent": "[$FieldName.email]" }
- mstevens22Copper Contributor
- SvenSieverdingBronze Contributor
mstevens22
in that case you can use the "title" property instead of the "email" property{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "inlineEditField": "@currentField", "txtContent": "@currentField.title" }
- VanlossCopper Contributor
A bit late, but if anyone looking for a solution, unfortunatelly it's not as simple as adding only a txtContent like in a text column.
For that, I rebuilt the formatting the best way I could to mimic the original formatting for person field. It will organise the people in a grid with their images and names. It's also clickable to see the people M365 profile. Just change the [$PERSON_COLUMN] to the name/id of your column and it's ready to go.
I hope it helps someone in the future 🙂{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "_comment": "MAIN DIV ===================", "elmType": "div", "inlineEditField": "[$PERSON_COLUMN]", "style": { "display": "inline-block", "width":"100%", "height": "100%", "padding": "6px", "box-sizing": "border-box", "-moz-box-sizing": "border-box", "-webkit-box-sizing": "border-box" }, "children": [ { "_comment": "FLEX DIV ===================", "elmType": "div", "style": { "display": "flex", "height": "100%", "width": "100%", "flex-wrap": "wrap", "box-sizing": "border-box", "-moz-box-sizing": "border-box", "-webkit-box-sizing": "border-box" }, "children": [ { "_comment": "LIST DIV ===================", "elmType": "div", "style": { "display":"flex", "flex-wrap": "wrap", "width": "auto", "margin": "auto 0px", "padding": "6px", "box-sizing": "border-box", "-moz-box-sizing": "border-box", "-webkit-box-sizing": "border-box" }, "children": [ { "_comment": "EACH PERSON =========", "elmType": "div", "forEach": "person in [$PERSON_COLUMN]", "defaultHoverField": "[$person]", "customRowAction": { "action": "defaultClick" }, "style": { "display": "flex", "text-decoration": "none", "color": "white", "cursor": "pointer", "margin": "5px 5px", "text-align": "left", "border-radius": "10px" }, "attributes": { "class": "ms-bgColor-neutralQuaternaryAlt ms-bgColor-themeSecondary--hover" }, "children": [ { "_comment": "PICTURE =========", "elmType": "div", "style": { "display": "flex", "width": "20px", "height": "20px", "margin": "auto 0px" }, "children": [ { "elmType": "img", "attributes": { "src": "=getUserImage([$person.email], 'S')" }, "style": { "width": "25px", "height": "25px", "border-radius": "25px", "margin": "auto", "position": "relative", "top": "-15%" } } ] }, { "_comment": "NAME =========", "elmType": "a", "txtContent": "[$person.title]", "style": { "color": "#9C9A98", "font-size": "11px", "font-weight": "400", "margin": "auto 15px auto 15px" } } ] } ] } ] } ] }
Good work Vanloss !
Anyone trying to use above JSON formatting, Note - In JSON [$PERSON_COLUMN] is an internal name of your person or group column in this format: [$InternalNameOfColumn].
You can get the internal name of your SharePoint list columns by following this article: How to find the Internal name of columns in SharePoint Online?
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.