Hi,
I am trying to embed an html component onto a dynamic page.
The html code is the same throughout all the dynamic pages except for the ‘‘src’’ which is a url that I want to get from the database.
Is it possible to do that?
3 Likes
I have the same issue here, anyone knows how to do it?
Hi Ori and Aaron,
Currently it is not possible to connect an HTML component to the dataset without code.
In order to dynamically connect the src attribute of the html component, you will need to use a little bit of code.
Assuming a Dynamic Page of a collection which has a url field
In the $w.onReady of the dynamic page:
- Get the current item’s url:
const itemUrl = $w('#dynamicDataset').getCurrentItem().url
- Set the src property of the html element to that url
$w('html1').src = itemUrl
1 Like
Hi Tom,
It looks like there are a few people interested in this - me included. For the benefit of us all, could you please show us the full page code that you use to display a URL on a dynamic page? Would you mind also giving some idea of how the URL is stored in your database (e.g. is it the only field with the ‘Field Type’ set to URL)?
Thank you
Hi Daniel,
You can take a look at the database yourself to see exactly how everything is stored.
For example, this is my Movies collection:
The Movies(Title) column is of type url , and it is the dynamic page url that I configured when creating it.
The URL field is another field of type URL. Note you can configure the field type by clicking on the three dots to the right of the colum header > Manage Properties.
Any field of type URL can be made the src of an html component.
I hope this answers your question.
1 Like
Thanks for your reply. Working with your example above, lets say I want to display the [url] field in an html component on a dynamic page (when that dynamic page loads). Assume the database is called Movies, the corresponding dataset is called #Movies, and the html component is called #html. Would the Wix page code be as simple as this?:
$w.onReady(function(){
const itemUrl = $w(‘#Movies’).getCurrentItem().url;
$w(‘#html1’).src = itemUrl;
});
If so, how would the page code know to get the url from [url] and not Movies(Title)?
1 Like
Hi Tom,
Please ignore my last post - I figured it out. If anyone is interested my Wix page code looks like this:
$w.onReady( () => {
$w(“#Dataset”).onReady( () => {
const itemUrl = $w(‘#Dataset’).getCurrentItem().url;
$w(‘#html1’).src = itemUrl;
} );
} );
My dataset is setup like the example that Tom shows above, including a field called [url] that is set to the field type URL.
4 Likes
For some reason this isnt working for me…
This is the code i have:
$w.onReady( () => {
$w(“#dynamicDataset”).onReady( () => {
const itemUrl = $w(‘#dynamicDataset’).getCurrentItem().url;
$w(‘#html1’).src = itemUrl;
} );
} );
And this is the error i get:
Loading the code for the Homes (Title, ID) page. To debug this code, open disq9.js in Developer Tools.
Wix code SDK error: The url parameter that is passed to the src method cannot be set to the value . It must be of type url.
Does anyone know why?
Hi,
Not offhand sorry. I can say that I did encounter this error when I was trying to get my page to work, and eventually I changed something that made that error disappear. Unfortunately I can’t recall what I changed, but we could work through a few things. Are you able to show us how your database is organised and let us know which field is set to the URL field type?
Thank you very much for this solution, but i get the same error like ori grion:
Wix code SDK error: The url parameter that is passed to the src method cannot be set to the value . It must be of type url.
Is there any solution to continue here?
My goal is it to use a Html code script for charts out of my database.
This html code script should then be emeded in different dynamic pages, everytime the script is a bit different.
Again, I don’t know offhand but we could work through a solution. Are you able to show us how your database is organised and let us know which field is set to the URL field type?
Hello Daniel Thomas
my database looks like this:
url is an URL Field and i although tried a text.
My goal is it to use the following embed code:
-------------------------------------------------------------------------
A dynamic page should get this code out of the database and paste it into a html-container.
Each code is a bit different.
At this moment my code looks like this for the html-container on the dynamic page looks like this:
export function html1_viewportEnter(event, $w) {
$w(“#dynamicDataset”).onReady( () => {
const itemchart = $w(‘#dynamicDataset’).getCurrentItem().url;
$w(‘#html1’).src = itemchart;
} );
}
Hope you can help me
thanks in advance
tried all database variants, and still get this issue:
Loading the code for the site. To debug this code, open masterPage.js in Developer Tools.
Loading the code for the Coins (Title) page. To debug this code, open pzvc6.js in Developer Tools.
Wix code SDK error: The url parameter that is passed to the src method cannot be set to the value
It must be of type url.
Let me start by saying that I am a complete novice and am not qualified in any way to diagnose problems. With that said, lets see if we can find a solution.
For my database I just have the URL in the URL field. For me this is: Great Auk right tarsometatarsus - 3D model by nzfauna [4f31e49] - Sketchfab.
For you this would be: https://de.tradingview.com/symbols/COINBASE-ETHUSD/
This may not be what you want, but could you please try using just your URL in the URL field to see if you get the same error? This would help us understand if it is the code wrapped around the URL that is causing the issue.
Hello daniel thomas,
thank you for your help but this isnt working cause we need the hole code.
Instead i must paste the whole code in the html component and just need to replace the link out of the code on each dynamic page with a link out of my database.
Is here a expert that can help me ?
Can anyone help me how to connect dynamic page through wix code after selecting table row .
I need incorporate here :
export function searchButton_onClick(event) {
wixData.query(‘CaterersQuatation’)
.eq(‘orderNumber’, $w(‘#textInput1’).value)
.find()
.then(res => {
$w(‘#table1’).rows = res.items;
});
}
Hi Atanu,
What do you want do achieve? what is the scenario ?
Roi.
I have used wix code for searing record and print it into table , Now I need to connect Dynamic page after selecting table row .
Below Code I have used for searing record .
export function searchButton_onClick(event) {
wixData.query(‘CaterersQuatation’)
.eq(‘orderNumber’, $w(‘#textInput1’).value)
.find()
.then(res => {
$w(‘#table1’).rows = res.items;
});
}
Hi,
You can use TableRowEvent and wixLocation.to methods.
It should look like this:
import wixLocation from 'wix-location';
$w("#myTable").onRowSelect( (event, $w) => {
let rowData = event.rowData; // {"fName": "John", "lName": "Doe"}
let rowIndex = event.rowIndex;
const myRow = event.target.rows[rowIndex]
wixLocation.to(`${myRow[link-myDynamicPage-_id]}`); // myDynamicPage is the name of your dynamic page.
} );
Roi.
1 Like
