Quickest way of removing line breaks or commas for non-existent address fields

I’m inserting dynamic data into a text field based on a users address. These fields are:

  • Address 1
  • Address 2
  • City
  • State
  • Post code/ZIP
  • Country

Specifically this is retreiving text data from an external API, so this is that way it needs to be formatted (not extracting from a geo address).

I’m aware that some users will not have Address 2, State etc. and in these cases I’m wondering of the best way of removing an empty line.

Going from this:
My address line 1
My address line 2
My City

France

To this:
My address line 1
My address line 2
My City
France

I understand I can add a whole load of conditions on the text field, but I just don’t feel this is the smartest way to go about it. Hopefully I’m missing something obvious…

There’s no simple alternative (where else would you do the computation?).

Just “Address 2 is not empty :formatted as…” as you suggest.

I thought perhaps something like “remove the line break empty” might exist. Ah well. It was more a curiosity. Thanks Keith.

1 Like

I’m actually wondering if I can use some CSS for this (initial thoughts are white-space and display properties). I’ll have a play around.

Well, the issue I’m pointing to is this:

You want to render this full address. It’s composed of a bunch of fields, some of which might be empty and you’re putting them each on their own line.

Now, if we had that string of text stored somewhere (that is, if we could pre-compose it), we could then do a regex on it and replace any \n\n (double newline) with \n (single newline).

Possible solutions in Bubble:

  1. We could (on some condition) execute a workflow to compose that string into a custom state and process the custom state. But this is VERY un-bubbly and you’d have a hard time figuring out wtf is going on when you come back to that page later. (Also, this will be slow for reasons I won’t belabor here. And this just feels like a non-starter.)

  2. Can we, in essence, precompose the string in place and process it. Well, we CAN, but it’s going to look very strange in the text element. You could do like this:

First, construct a condition that is always true (or always false, your pick). We could do something like:

This URL is not empty

And now we could slap :formatted as text on it:

This URL is not empty :formatted as text

And now, in the popup that appears, you will have two long text input fields where you can compose a text.

Drop your address formatting in the yes field (the no condition will never be triggered so fuggetabboutit).

That being done, you can slap :search and replace or :replace with regex on it:

This URL is not empty :formatted as text :search and replace

Now, in the s&replace dialog that appears, set it up to replace return return with return.

Now all your double breaks will be single breaks and the text will render the way you want.

But consider what happens when you revisit this page later: WTF is;

This URL is not empty :formatted as text :search and replace

???

The only way to tell is to drill into This URL is not empty. There’s no indication of what’s going on in that black box.

Better, I would say (but just barely, I’ll grant you), to just write out the lines, even if all of them need a condition like:

Address is not empty formatted as…
Address2 is not empty formatted as…
Etc.

Because at least, at a glance, we can understand what’s going on.

!! Thanks for the concise info. I spent a little time fiddling with some basic CSS and came up with an easy solution for this. The CSS code is pretty straight forward (a simple pseudo selector) and it means I don’t need to add any conditions at all. Granted it uses HTML rather than a text field, but I’m perfectly happy working with that.

<style>
#address-container .address {
    display: block;
}
#address-container .address:empty {
    display: none;
}
</style>

Preview:

Editor:

This topic was automatically closed after 70 days. New replies are no longer allowed.