Custom address dropdown using focus group and repeating group

andrew_crowe · 2025-02-17T13:38:53.926Z

Hi guys.

I have created a simple address dropdown, with a focus group that shows suggested addresses based on a given postcode. The addresses are in a repeating group.

For some reason I simply cannot fathom, each address is underlined with a dashed line. I want to remove this, or effectively have it made invisible by making the dashed line the same colour as the background.

To clarify, the dashed line is not the separator in the repeating group. It seems to be part and parcel of the address that it is bringing in from the GetAddress plug-in. The type of content of the repeating group is set to ‘text’.

Anyone encountered this issue before? The problem is something to do with the text. Interestingly, if the address includes a company name, the name is not underlined with a dashed line - only the rest of the address is.

WhatsApp Image 2025-02-17 at 12.13.41944×2048 143 KB

boston85719 · 2025-02-17T13:58:03.313Z

have you checked the text element in the repeating group to see if it is formatted to be underlined?

andrew_crowe · 2025-02-17T14:59:06.000Z

Yes, there is no such formatting.

It’s also a dashed underline so not normal underline too. I was wondering if I could somehow change the text decoration to white so that it is effectively invisible to the naked eye? Presume I’d have to do this with a HTML element instead of a text element though - don’t think you can do this with the rich text editor?

boston85719 · 2025-02-18T03:11:43.189Z

Check on other browsers if you have not already…could be browser based.

Check in dev tools inspector on browser to see the html on it, maybe a bug causing it that is not visible in editor.

And I think your workaround to use some custom css on it might work if needed.

andrew_crowe · 2025-02-19T21:06:25.163Z

Thanks for your comment.

Bizarrely, the dashed underlining of the address on the dropdown only appears on my iphone, not on my mac (both browsers are chrome).

I have tried to use some html / css but this is all new to me. I have tried to use the text-decoration: none with #nodashedunderline as the name of an ID attribute and then applied this to the relevant element but it’s not working.

I don’t know how to code!

boston85719 · 2025-02-20T02:09:14.230Z

I’d suggest asking ChatGPT as it seems issue is browser based and perhaps even version of the browser based as well.

Not all browsers support same types of formatting or styling.

AloysioFranca · 2025-02-20T03:15:20.435Z

I wouldn’t use an ID to edit the element’s CSS because an ID only works for a single element, and in a repeating group, you have a list.
The ideal approach is to find the CSS class using the browser’s inspect tool and add !important at the end (before the semicolon).
Example: text-decoration: none !important;