Lookup image conditionally in SharePoint list formatting

Question

I have a column named LinkType that will tell if the item is a Bug, Requirement, Feature, etc and based on the value I would like to display different pictures. Previously I was using a similar setup with the iconName attribute, but for some reason it does not seem to work the same way with displaying images conditionally. What is wrong?

  "elmType": "img",
  "style": {
      "width": "100px"
  },
  "attributes": {
      "src": "=if([$LinkType] == 'Requirement', '/sites/aaa/publishingimages/requirement.gif', if([$LinkType] == 'Feature', '/sites/aaa/publishingimages/feature.gif', if([$LinkType] == 'Task', '/sites/aaa/publishingimages/task.gif', if([$LinkType] == 'Query', '/sites/aaa/publishingimages/query.gif', if([$LinkType] == 'Bug', '/sites/aaa/publishingimages/bug.gif', 'ErrorBadge'))))"
  }
   

Answer 1

Your format snippet looks mostly fine and you should definitely be able to set an image's source conditionally. However, looks like you still have the ErrorBadge iconName value at the end. Without additional detail, it's hard to troubleshoot the exact problem you are experiencing. Try adding a "debugMode":true" to your format and opening the console to see if there are any helpful error messages.

In the meantime, it looks like you could simplify your format a bit to something like this:

{
  "elmType": "img",
  "style": {
    "width": "100px"
  },
  "attributes": {
    "src": "=@currentWeb + '/publishingimages/' + toLowerCase([$LinkType]) + '.gif'"
  }
}