Table cell has 4 different link, how to click them seperately

💬 App Building
1

I am using following sql query to get link and click them seperately. is there any other option in retool to do?

GROUP_CONCAT(CONCAT('Picture

') SEPARATOR '\n') AS pictureUrl,

picsOptions

2

i am uploading following, hier shows what it is not!

sqlHtml
sqlHtml725×308 27.1 KB

3

column name: Links, under that column in one cell holds 4 different links, which are seperated with coma (,) like below one.
i need to divide them 4 different peices, and turn them into drop down list, so user can go wherever user clicks any dropdown options.

https://www.google.com/,https://www.yahoo.com/,https://www.youtube.com/,https://www.retool.com/

4

Can you post the actual data you are trying to separate? Just as an example? Also, I don't think you can add a dropdown type field in the table, probably tags most likely

5

You should use HTML as column type of new table component.

image
image1450×741 45.8 KB

And you should split the value of links to array, and mapping them to the value of HTML.

In my demo, you can click them seperately.

image
image1461×616 39.3 KB

{{item.split(",").map(it=>`<a href="${it}">${it}</a>`).join("<br/>")}}

Here is exported app json
seperateLinks.json (18.5 KB)

2 Likes
6

many Thanks.

right now i am using that kind of code in my sql query, i am leaving it bottom. should i update my trigger (js query) too, since link does not take me to the page? i leave it bottom too.

GROUP_CONCAT(CONCAT('<a target="_blank" href="',CONCAT(domain, extension), '">Picture</a><br></br>') SEPARATOR '\n') AS pictureUrl,```

SQL query
let url = ID_Now_Information.selectedCell.value + "";
utils.openUrl(url, { newTab: true });
7

instead of `´ i used ' ', so it did not work, then i thought i need js query to trigger it
thanks @AnsonHwang,

a little bit changed version of the solution to open the link as a new tab and add a number for each link

{{ item.split(",").map((element, index) => `<a href="${element}" target="_blank"> ${index+1}. Driver Licence</a>`).join("<br/>") }}
2 Likes