Generate clickable URIs with formulas

Baserow Help
#1

is there a way to make URIs generated by a formula field “clickable”?

I have tried:

The resulting string was displayed correctly. One can copy the string and paste it in a new browser tab/window. However, the purpose is to enable the user to click on the field to open a new browser tab/window.

The HTML code was escaped, so it displayed correctly but did not result in a clickable link.

#2

This is a great idea! We already have an URL field and so the formula field should definately also support this. I’m thinking perhaps there should be a function like url('http://your-text-here.com') That will display your text as an URL field, do you think this solution would suit you well? There might be other ways of doing this like a checkbox option perhaps on the Formula field edit menu? But that seems inconsistent with the other field types.

#3

I think a function like url(‘http://your-text-here.com’) or url(‘http://your-text-here.com’, ‘label’), where label can be null and defaults to the URI, would be a great solution.

A styling option for the formula column, rendering all fields as URLs, would also solve this. However, I concur, the canonical resolution appears to be a separate keyword.

1 Like
#4

I did take a look at the code and managed to introduce a new formula URL keyword:
https://gitlab.com/liob/baserow/-/commit/ced65afb09c06eb67d09dace126b910eb354fc39

image
image964×951 77.7 KB

However, I am stuck at the rendering part. Currently, the html code is getting escaped:

image

@nigel can you give me a hint, how I can influence the rendering in a way, that the html code is not getting escaped?

When / if finished I will send a PR.

#5

@honeycut Awesome! The link you shared doesn’t work for me, I think your fork is private.

So I was thinking the way url would work is that we’d introduce a new Formula Type called the
BaserowFormulaLinkType.

This is because atm the way we decide how to render a formula in the frontend is by using its formula_type. For example if you write a formula like 1+1 the backend calculates it’s formula_type is number and then the frontends BaserowFormulaNumberType then has methods which define how to render a formula of that type (BaserowFormulaNumberType.getFunctionalGridViewFieldComponent etc).

And so I’d imagine this way of solving this issue would look like:

  1. There would be a new backend BaserowFormulaLinkType
    1. I think this would be a copy paste of the existing BaserowFormulaCharType but perhaps with a slightly different cast_to_text implementation.
  2. There would be a new backend function called BaserowUrl which returns a formula of type BaserowFormulaLinkType and perhaps saved to the database a string like f"url=label" instead of raw html
  3. There would be a new web-frontend BaserowFormulaLinkType once again very similar to the BaserowFormulaCharType but instead defining its own components which render it
  4. There would be a new FunctionalGridViewFieldFormulaLink and RowEditFieldFormulaLink components used by BaserowFormulaLinkType which split the value to get the url and label components, and then render those as a link something like
... todo copy the rest from something like web-frontend/modules/database/components/view/grid/fields/FunctionalGridViewFieldText.vue
<a href="this.$options.methods.getUrl(this.$props.value)">
{{ this.$options.methods.getLabel(this.$props.value) }}
</a>

... todo implement the methods getUrl and getLabel

But perhaps there is a simpler way? Not sure

#6

Alternatively perhaps we should just instead add markdown support

#7

I think markdown support would be great.

In the meantime I have created a PR for the URL keyword:

2 Likes
#8

+1 interested in this one as well.

1 Like
#9

Hey! Interested to know if this is possible yet

#10

Yup check out the button formula function :slight_smile: