Display the first word of a full name in Retool?-CodePudding

I have a prebuilt column of names in my SQL table. The first name and surname are on the same column. I want to only display the first name in Retool. How do I separate out the first name only from a full name in Retool using JavaScript?

Example "John Smith" should only display "John"

CodePudding user response：

If you want to use JavaScript you can do

function first_name(full_name) {
    return full_name.split(" ")[0];
}

CodePudding user response：

In the Table component Inspector (the right-hand panel), there is a section to edit the column settings. Click on your full_name column to show the settings for that column, and you will see an input for the Mapped Value. This setting allows you to alter the displayed value in the table. Assuming your column contains a first and last name, separated by a space character, like this:

full_name
------------------
Ursula User
Barry Bore
Eva Noyce
Elizabeth Meets

Then you can use a short Javascript expression to split the value on the space character and display only the first value.

{{ self.split(' ')[0] }}

In this example, everything inside the {{ }} evaluates to Javascript and the self variable represents the value for each cell in the column.

Here's a screenshot of the table before adding the Mapped Value:

And here's a screenshot of the table after adding the Mapped value:

There are, of course, many ways to do this in Retool, depending on your preference. You can also split a string in SQL. For example, in PostgreSQL, there is a function called split_part() which allows you to split string based on a delimiter similar to the Javascript split function used above. Using this would allow you to skip the Javascript altogether and do your string manipulation in SQL:

select 
  split_part(full_name, ' ', 1) as first_name
from 
  users

Here's an example of this method in action: