I was recently working on an app to display items from a SharePoint list in a gallery. This list, let’s call it Teachers, has 2 columns: Title and Grade. The Title column is a Single line of text column and the Grade column is a Choice column that allows multiple selections. Displaying the records in a gallery is usually straightforward: you set the Text property of each label to the respective column using the following value: ThisItem.ColumnName. This is very easy for my Title column because it is set as follows: ThisItem.Title. You can say, “But wouldn’t you use the same approach for the Grade column?”, but because Choice columns are complex, the approach is different. Let’s walk through that:
You would think that to set the Text property of the label for Grade you can set is as follows: ThisItem.Grade.Value. This does not work because the label is expecting a Text value, but the output of ThisItem.Grade.Value is a Table.
To display the Table output of ThisItem.Grade.Value, you can use the Concat() function as follows: Concat(ThisItem.Grade.Value, Value & “, “). The output now looks like the one in the image below:
It is looking better, but what about the extra comma at the end? How can it be removed without affecting the commas that separate each grade? You can use a combination of the following functions: Left() and Len() with the Concat() function used above. This is the final functionality and the correct output for the Grade values:
Left(Concat(ThisItem.Grade.Value, Value & “, “), Len(Concat(ThisItem.Grade.Value, Value & “, “)) – 2)
The Left() function requires two parameters:
- The string to get the characters from.
The output of the Concat(ThisItem.Grade.Value, Value & “, “) function.
- The number of characters to retrieve from the string.
The output of the Len(Concat(ThisItem.Grade.Value, Value & “, “)) – 2 function.
The function retrieves the number of characters from the given string, which in this case is the same output of the Concat(ThisItem.Grade.Value, Value & “, “) function. Then, the – 2 subtracts the last 2 characters from the string. These characters are the last comma and the extra space. You can see the correct output of the Grade in the image below:
Please give this a try and let me know in the comments section below. Thank you for reading and have a wonderful day 😀