I have a PnP Modern search’s Search result web part. and i am using the “Details List” layout, as follow:-

And i added a slot named “LoadStatus”, as follow:-

then inside the “Manage Columns” section, i tried to add this expression to colour code the field based on its value:-

but i got “false” for all the items, as follow:-

so what could be the reason?

​I have a PnP Modern search’s Search result web part. and i am using the “Details List” layout, as follow:- And i added a slot named “LoadStatus”, as follow:-  then inside the “Manage Columns” section, i tried to add this expression to colour code the field based on its value:-{{#eq slot item @root.slots.LoadStatus “OPEN”}}
<div class=”sp-css-backgroundColor-BgCoral sp-css-borderColor-CoralFont sp-field-fontSizeSmall sp-css-color-CoralFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “COVERED”)}}
<div class=”sp-css-backgroundColor-BgGold sp-css-borderColor-GoldFont sp-field-fontSizeSmall sp-css-color-GoldFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “DISPATCHED”)}}
<div class=”sp-css-backgroundColor-BgGold sp-field-fontSizeSmall sp-css-color-GoldFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “AT SHIPPER”)}}
<div class=”sp-css-backgroundColor-BgCyan sp-css-borderColor-CyanFont sp-field-fontSizeSmall sp-css-color-CyanFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “LOADED”)}}
<div class=”sp-css-backgroundColor-BgMintGreen sp-css-borderColor-MintGreenFont sp-field-fontSizeSmall sp-css-color-MintGreenFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “CONSIGNEE”)}}
<div class=”sp-css-backgroundColor-BgMintGreen sp-css-borderColor-MintGreenFont sp-field-fontSizeSmall sp-css-color-MintGreenFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “AT RECEIVER”)}}
<div class=”sp-css-backgroundColor-BgMintGreen sp-css-borderColor-MintGreenFont sp-field-fontSizeSmall sp-css-color-MintGreenFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “DELIVERED”)}}
<div class=”sp-css-backgroundColor-BgLightGray sp-css-borderColor-LightGrayFont sp-field-fontSizeSmall sp-css-color-LightGrayFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “INVOICED”)}}
<div class=”sp-css-backgroundColor-BgLilac sp-css-borderColor-LilacFont sp-field-fontSizeSmall sp-css-color-LilacFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else if (eq slot item @root.slots.LoadStatus “CANCEL/TONU”)}}
<div class=”sp-css-backgroundColor-BgLightGray sp-css-borderColor-LightGrayFont sp-field-fontSizeSmall sp-css-color-LightGrayFont”>
{{ slot item @root.slots.LoadStatus}}
</div>
{{else}}
{{ slot item @root.slots.LoadStatus}}
{{/eq}} but i got “false” for all the items, as follow:-  so what could be the reason?  Read More

​