2

I have the following SharePoint list in which the "Participant" columns are text values (names of people) and each item in this list is a training event. "Evenement" is the type of training and "Jour" means day of the training.

What I need to do is whenever someone hovers on the name of a participant - I need their past training events to show. For example if "Participant 1" is Alpha and his "Jour 1" is on 11-05-2021 then "Jour 2" is on 12-05-2021 and "Jour 3" is 13-05-2021 and finally "Jour 4" is 14-05-2021. I need all this information to show on a hovercard if possible?

I am not sure if this makes complete sense or not and if it's even possible but any guidance would be appreciated, thank you in advance to anyone who replies and please be advised I'm only starting with JSON .

Sharepoint List Preview

2

In order to display a custom hover card, you need to use customCardProps element. See more details here. It has the following properties:

openOnEvent

  • hover - card appears on mouse hover;
  • click - card appears on click on the field.

directionalHint

  • topCenter bottomCenter leftCenter rightCenter
  • isBeakVisible - boolean. if true the card has a beak.

enter image description here

Sample JSON

{
    "elmType": "div",
    "txtContent": "@currentField.title",
    "customCardProps": {
        "openOnEvent": "hover",
        "directionalHint": "rightCenter",
        "isBeakVisible": true,
        "formatter": {
            "elmType": "div",
            "style":{ "display": "block", "font-size": "15px", "padding": "10px" },
            "children": [
                {
                    "elmType": "div",
                    "style": { "display": "block", "width":"100%", "text-align": "center", "padding": "10px" },
                      "children":[
                        {"elmType": "div", "txtContent":"Jour 1: 11-05-2021"},
                        {"elmType": "div", "txtContent":"Jour 2: 12-05-2021"},
                        {"elmType": "div", "txtContent":"Jour 3: 13-05-2021"},
                        {"elmType": "div", "txtContent":"Jour 4: 14-05-2021"}
                      ]
                   
                }
            ]
        }
    }
}

In your case, you will have to create a new multiline field that would include all this information. Then, you can create a Power Automate flow that is responsible for populating this new field automatically.

This way, your JSON formula will simply need to reference a single field to display correct content, in the same list item. This is necessary because JSON formatting scope is limited to the current list item.

You can make your card as fancy as you want. For example:

enter image description here

1

As per my understanding from your question, you are trying to read the information from multiple items/rows & show it on the hovercard (Correct me if I am wrong).

If this is the case then it is not possible using JSON Formatting.

In JSON column formatting, you can only read the columns from same item/row.

For more information, check my answer at: How can JSON column formatting be used to highlight duplicate entries in a column a list?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.