Update Html Component Based on Selection from Table

Discussion Ask a question
,
1

Hello,

I have a table with a field ID set to URL, and an HTML component on my page. When I click a table row I would like the html component to update to that show that URL. I am currently getting an error “The url parameter that is passed to the src method cannot be set to the value . It must be of type url.” Sorry for the vagueness, but I have been seeing more posts about this. Please let me know if you need more detail to help answer! Any and all help is greatly appreciated.

2

Show us the code and we can better understand what you mean.

3

The field key with the urls listed is called mapLink, and it is located in dataset2. I would like the url that opens in the iframe/html to update when I click another selection in the table. I am sorry I am bad at explaining this, it is all new to me. Thank you for your quick reply.

export function table2_rowSelect(event) {
let currentItem = $w('#dataset2').getCurrentItem()
$w("#html1").src = ('mapLink')
4

Try this:

$w("#html1").src = currentItem.mapLink;
1 Like
5

You have no idea how much I appreciate your help. It worked!! Thank you

6

Hello again, I have added another HTML element. I would like this element to do basically the same thing as above, except I would like it to display a PDF which I have in the dataset, and field type is ‘Document’. I am getting 404 errors in the HTML element where I would like the PDF to be displayed. Do you know how I could accomplish this?

7

Probably (but that is a guess) you have the path to the PDF wrong. Wix stores its images and documents using an internal Wix path (URL), which cannot be used directly to access the image or document from the “outside”, which is what you do in a html-component.
So what you need to do is reformat the URL that Wix gives you. Now, search this forum. A long time ago I had the same problem with accessing Wix images in an html-component.
I found a piece of code by Andreas Kviby. It no longer worked, so I corrected it. It is an piece of code for images, but with a slight ajustment it should work for PDF´s.

It´s somewhere in here. If you can´t find it, let me know, I will look it up in some of my projects.

EDIT: found it, a second time I posted it, but it´s the same.

Replace the wix:images with the prefix that the PDF-url holds in wix.

8

@giri-zano Hello again.

I have changed the page a little bit thinking I could change the code easily. I was not able to. Instead of selecting a row in a table, I would like the html page elements to display a url after a button is clicked. The url (field key dmaplink) does not display in html2 element, and the PDF does not show in html1 element now. Do you know what I could change, or how I could get this working again? Here is the code I am using :

export function button13_click(event) {

wixData.query(“VolumeMaps”)
.eq(“yardName”, $w(“#volumedropdown”).value)
.eq(“date”, $w(“#volumedatedropdown”).value)
.eq(“email”, $w(“#input3”).value)
.find()
.then( (results) => {
console.log(results.items)
let currentItem = results.getCurrentItem()
$w(“#html1”).expand();
$w(“#html2”).expand();
$w(“#html2”).src = currentItem.dmaplink;

let source;

source = $w("#button10").link;

let names = source.split(“/”)[4];
let urls = source.split(“/”)[3];

 $w("#html1").src = `https://docs.wixstatic.com/ugd/${urls}?`;

wixLocation.to(https://docs.wixstatic.com/ugd/${urls}?dn=${names}.pdf);

}
)}

9

I implemented this over a year ago and it was working fine. Recently, the first page does not load properly. The URL is updated to the correct dynamic page but it only displays if you refresh the page. Otherwise it stays on the default URL associated with the dynamic page. Even if you don’t manually refresh, the subsequent dynamic pages display correctly…Thoughts?

10

Maybe you better open your own post, with your own in detail described issue ?