How would I Titlecase or Capitalize array data on a page? Using normal formatting options causes a disappearing act

Wappler General How To
#1

Hey all,

I have data I am displaying on my page, by referencing the number in the array, e.g.

{{_source.experience[0].title.name+' - '+_source.experience[0].company.name+' ('+_source.experience[0].start_date.formatDate('MMM yyyy')+' - '+_source.experience[0].end_date.formatDate('MMM yyyy')+')'}}

What’s odd, is the formatDate works fine, but when I try to titlecase or capitalize the title.name or company.name - the code exists but when I try to render the data in the browser - the line with the titlecase or capitalize formula dissappears.

Assuming I’m just doing something wrong - so any guidance appreciated.

#2

What is the code you enter exactly and are there errors in the browser console?

#3

Hi @Teodor,

This is the code with the titlecase attempt:

{{_source.experience.name[0].title.titlecase()+' - '+_source.experience.name[0].company.titlecase()+' ('+_source.experience[0].start_date.formatDate('MMM yyyy')+' - '+_source.experience[0].end_date.formatDate('MMM yyyy')+')'}}

And I didn’t notice any errors

#4

Just bumping this @Teodor if you have any suggestions?

#5

Gently bump @Teodor - still happening…

#6
#7

I tested this and it seems to be working fine. Tested on a content page on a NodeJS project, as i know that’s what you are using. Can you please check for errors or warnings in the console once again?

#8

Try:

{{_source.experience.name[0].title.titlecase()}} - {{_source.experience.name[0].company.titlecase()}} ({{_source.experience[0].start_date.formatDate('MMM yyyy')}} - {{_source.experience[0].end_date.formatDate('MMM yyyy')}})
#9

Hi @patrick - thank you, unfortunately this didn’t solve it. The dates show up - but the title and company name are not visible.
On the rows beneath with the same string but [1] and [2] etc. without the titlecase formatter they render fine, just lowercase.

@Teodor checked again, no errors in the console, or network tab. Some sourcemap warnings etc. but nothing relating to this.

#10

Is it only specific with the titlecase or with any formatter? Try to use for example the uppercase formatter

#11

I just tried capitalize formatter, same outcome unfortunately.

#12

Where did the data come from? Is it possible that the title and company are no strings.

You can try:

{{string(_source.experience.name[0].title).titlecase()}}
#13

Hey @patrick - this just returned ‘Undefined’ unfortunately.

The data comes from an API. I can titlecase other data returned by the same API, just not these set of values.

#14

Can you check the API response in the Network Tab to see how are they returned? Just make a screenshot in the XHR tab after you make the call.

#15

shared privately due to unique id’s.

#16

Could you type dmx.parse('_source.experience.name[0].title') inside the console and see what it returns. Then try dmx.parse('"mytitle".titlecase()') and see what that outputs.

#17

dmx.parse(’_source.experience.name[0].title’) - returns ‘undefined’
dmx.parse(’“mytitle”.titlecase()’) - returns “Mytitle”

Screen Shot 2020-10-09 at 7.44.13 pm
Screen Shot 2020-10-09 at 7.44.13 pm900×190 15.3 KB

#18

Confirmed as solved by the amazing Wappler team!

#19
#20

How?