How to dynamically change CollectionView item title with a different columns?

Mobile
1

Hi there, I'm a bit new to Retool. I'm trying to display item names in languages (Eng/Viet) and I'm having a hard time trying to dynamically change item's name. My Collection View's data source has a column for the item's English name and another column for the item's Vietnamese name and I wanted the Collection View to dynamically change it's title based on the localStorage's language.

So far I have typed JS right into the Title input as {{ if (localStorage.values.Language == "English") {item.Item_Name} else if (localStorage.values.Language == "Tieng Viet") {item.Viet}}} . And it doesn't display because it's not working

image
image1073×684 105 KB

I've also tried to make a temporary state as itemNameViet and tried to run a JS code in many ways and this is the best I can manage even though it can't be read. How can I improve my syntax?

image
image1916×930 214 KB

2

Try making it a ternary operation like so right in the mapped options:

{{ localStorage.values.Language == "English" ? item.Item_Name : item.Viet }}
2 Likes
3

Thanks so much, this worked like a charm!! I'm glad to have learned ternary operators from you :grin:

1 Like
4

Not sure that this would ever be useful to you, but in case you find writing complex ternary statements too cumbersome... you can write immediately invoked anonymous functions like so, and return whatever you want. Bit easier to read if you have lots of logic, etc.

{{
(()=>{
 let x = 1;
 let y= 2;
 let z = 4;
  
  if(x+y+z == 6)
    return true
  else
    return false
  
 })()
}}
2 Likes
5

Yes I was also planning to ask this today, thanks so much for this solution, hopefully this works!