Make multiple choices appear as individual choice pills in Lists

[Alizander]

Hi there,

Grey row in Screenshot 1: When I add things to my List manually, the different choices within a multiple-choice column appear as individual coloured choice pills. This is what I want.

White row in Screenshot 1: Unfortunately when items are imported from a Microsoft Form using a Flow, they are collected into a this string-like format: ["x", "y", "z"] (see column Expertise in Screenshot 1) and can only be selected as one unit of that special combination. For instance, filtering for Agriculture would not even return the second row here, because it would need to be filtered for the whole combination ( ["Agriculture", "Global health", "Data science"] (see Screenshot 2).

As you can see, it happens also when only one choice is selected (column Equipment knowledge).

Screenshot 1

Screenshot 2

Does anyone know how to make automatically collected multiple choices appear as individual choice pills, or at least make it so they can be filtered for one by one?

Many thanks! 😊

P.S. the code in the column formatting:

{

"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",

"elmType": "div",

"style": {

"flex-wrap": "wrap",

"display": "flex"

},

"children": [

{

"forEach": "__INTERNAL__ in @currentField",

"elmType": "div",

"style": {

"box-sizing": "border-box",

"padding": "4px 8px 5px 8px",

"overflow": "hidden",

"text-overflow": "ellipsis",

"display": "flex",

"border-radius": "16px",

"height": "24px",

"align-items": "center",

"white-space": "nowrap",

"margin": "4px 4px 4px 4px"

},

"attributes": {

"class": {

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Agriculture"

]

},

"sp-css-backgroundColor-BgMintGreen sp-css-borderColor-MintGreenFont sp-css-color-MintGreenFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Bioinformatics"

]

},

"sp-css-backgroundColor-BgGray sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Cancer research"

]

},

"sp-css-backgroundColor-BgSage sp-css-borderColor-SageFont sp-css-color-SageFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Cardiometabolic diseases"

]

},

"sp-css-backgroundColor-BgCoral sp-css-color-CoralFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Clinical trials"

]

},

"sp-css-backgroundColor-BgDarkPurple sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Data science"

]

},

"sp-css-backgroundColor-BgLightGray sp-css-borderColor-LightGrayFont sp-css-color-LightGrayFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Equipment"

]

},

"sp-css-backgroundColor-BgGold sp-css-borderColor-GoldFont sp-css-color-GoldFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Genetics"

]

},

"sp-css-backgroundColor-BgTeal sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Global health"

]

},

"sp-css-backgroundColor-BgLightPurple sp-css-color-LightPurpleFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Immunology, inflammation"

]

},

"sp-css-backgroundColor-BgLightBlue sp-css-borderColor-LightBlueFont sp-css-color-LightBlueFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Infectious diseases"

]

},

"sp-css-backgroundColor-BgBlue sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Neuroscience"

]

},

"sp-css-backgroundColor-BgOrange sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Regeneration, repair"

]

},

"sp-css-backgroundColor-BgBrown sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Reproductive health"

]

},

"sp-css-backgroundColor-BgDarkPink sp-css-borderColor-WhiteFont sp-css-color-WhiteFont",

{

"operator": ":",

"operands": [

{

"operator": "==",

"operands": [

"[$__INTERNAL__]",

"Veterinary science"

]

},

"sp-css-backgroundColor-BgMintGreen sp-css-borderColor-MintGreenFont sp-css-color-MintGreenFont",

"sp-field-borderAllRegular sp-field-borderAllSolid sp-css-borderColor-neutralSecondary"

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

]

}

},

"txtContent": "[$__INTERNAL__]"

}

]

}

[creativeopinion · Accepted solution]

@Alizander Refer to this section of my YT Tutorial: How to Get a Microsoft Form RSVP Response into a SharePoint List

IN THIS VIDEO:

✅ How to get a Microsoft Form Response into SharePoint

✅ How to get a Microsoft Form ID

✅ How to get a Microsoft Form response

✅ How to Build a Microsoft Form with Conditional Fields

✅ How to used Branching in Microsoft Forms

✅ How to format Microsoft Form multiple choice responses for a SharePoint multi-choice column

✅ How to parse a Microsoft Form multiple choice response as string of text

✅ How to convert a text response to a number

✅ How to use the Switch action

✅ How to create a custom email confirmation for a Microsoft Form submission

✅ How to Create a Custom View in a SharePoint list

✅ How to use the Compose Action

✅ How to write Power Automate Expressions

----

You might also be interested in this YT Tutorial: How to Get Microsoft Form File Uploads Attached to an Email 📧

In this Microsoft Power Automate Tutorial I’m going to cover where file uploads from your Microsoft Forms are saved. I’ll also show you how attach the uploaded files to an email and how to dynamically name the files and customize the recipient of the email based on the selections made in your Microsoft Form. I will also cover how to handle responses that don’t include any file uploads.

IN THIS VIDEO:

‌✅‌ Two types of MS Forms

‌✅‌ Where Microsoft Personal (OneDrive) Form File Uploads are Saved

‌✅‌ Where Microsoft Group Form File Uploads are Saved

‌✅‌ How to Add a File Upload Question to an MS Form

‌✅‌ How to get a Microsoft Form ID

‌✅‌ How to get a Microsoft Form Response

‌✅‌ How to Get the Dynamic Content Microsoft Form File Upload Content

‌✅‌ How to handle Single and Multiple Microsoft Form File Uploads

‌✅‌ How to use a Scope action to Organize and Group Your Flow Actions

‌✅‌ How to Get the File Content from an MS Form File Upload

‌✅‌ How to Collect All Files Uploaded to a MS Form and Attach to an Email

‌✅‌ How to Handle MS Form Response When a File Isn’t Uploaded

‌✅‌ How to Create an Email Key

‌✅‌ How to Send an Email to a Specific Recipient Based on Form Selection

‌✅‌ How to Create a Dynamic Output Based on Form Selection

Hope this helps!

If I helped you solve your problem—please mark my post as a solution ✅.
Consider giving me a 👍 if you liked my response! If you're feeling generous— ☕️  Buy me a coffee: https://www.buymeacoffee.com/acreativeopinion

👉 Watch my tutorials on YouTube
👉 Tips and Tricks on TikTok

[v-qiaqi-msft · Accepted solution]

Hi @Alizander,

It's is easy to achieve.

json(body('Get_response_details')?['rfd513626b03b41fd873c992d83806885'])//Here replace with your response field

[Alizander]

Thank you so much, both! Putting these two responses together, I managed to solve the issue. I really appreciate your help!