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?
Important forum update
This forum is migrating to one unified Wix community forum starting July 26th, and will be read-only during the process.
Wishlist Page is the official platform for requesting new features. You can vote, comment, and track the status of the requested features.
Hi all. The htmlComponent either takes a url (I.e. https://www.xyz.xxx) or you add your html to the html component using the edit button on the element. What is seems most folks want to do is use code and not a url.
If you use code The you need to add a message handler that takes a message (the dynamic page info) and updates the html accordingly.
Take a a look at the $w.htmlComponent documentation for how to do this.
Cheers
Steve
Is it possible to get a text from the database and send it to the html element?
if it is possible, why not create a text field in the database is there put the html code and send it complete to the html element?
Hi Roi
I have a HTML code as
<!-- LikeBtn.com BEGIN --> <span class="likebtn-wrapper" data-theme="custom" data-btn_size="45" data-f_size="25" data-icon_size="35" data-icon_l="arr7-u" data-icon_d="arr7-d" data-icon_l_c_v="#16a200" data-icon_d_c_v="#ac0303" data-white_label="true" data-identifier="Robert Downey" data-show_like_label="false" data-counter_frmt="comma" data-counter_padding="10" data-counter_zero_show="true" data-tooltip_enabled="false"></span> <script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script> <!-- LikeBtn.com END -->
I just want to change the data-identifier text (which here is Robert Downey) of the html element which is at dynamic page of my wixsite as my code differ only at data-identifier. and i want to connect this text inside the data identifier component with my database with field named as "Name". Please tell me how could i do this. I need your help.
Hoping someone can help me - is there a way to embed a calendar link onto a dynamic page?
Hi Roi,
I have tried but still getting error . Can you please help me .
Code
export function table1_rowSelect(event, $w) { let rowData = event.rowData; // {"fName": "John", "lName": "Doe"} let rowIndex = event.rowIndex; const myRow = event.target.rows[rowIndex] //wixLocation.to(`/CaterersQuatation/${wixUsers.currentUser.id}`); // myDynamicPage is the name of your dynamic page. wixLocation.to(`${myRow[/CaterersQuatation/${OrderNumber}/${CatererName}]}`); }
Look for it in the:
const myRow = event.target.rows[rowIndex] Object
Roi.
Thanks Roi for your response , can you please help with myDynamicPage url .
DB Name : CaterersQuatation
Field Name : {OrderNumber} and {CatererName}
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.
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 Atanu,
What do you want do achieve? what is the scenario ?
Roi.
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;
});
}
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 ?
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: https://sketchfab.com/models/4f31e49f07c64693b85fa0acfda786a4/embed.
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.
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
<!-- TradingView Widget BEGIN --> <div class="tradingview-widget-container"> <div id="tradingview_b6820"></div> <div class="tradingview-widget-copyright"><a href="https://de.tradingview.com/symbols/COINBASE-ETHUSD/" rel="noopener" target="_blank"><span class="blue-text">ETHUSD</span> <span class="blue-text">chart</span> by TradingView</a></div> <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script> <script type="text/javascript"> new TradingView.widget( { "autosize": true, "symbol": "COINBASE:ETHUSD", "interval": "30", "timezone": "Europe/Berlin", "theme": "Light", "style": "1", "locale": "de_DE", "toolbar_bg": "#f1f3f6", "enable_publishing": false, "hide_top_toolbar": true, "save_image": false, "hideideas": true, "container_id": "tradingview_b6820" } ); </script> </div> <!-- TradingView Widget END -->.
It must be of type url.
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:
-------------------------------------------------------------------------
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div id="tradingview_a691f"></div>
<div class="tradingview-widget-copyright"><a href="https://de.tradingview.com/symbols/COINBASE-ETHUSD/" rel="noopener" target="_blank"><span class="blue-text">ETHUSD</span> <span class="blue-text">chart</span> by TradingView</a></div>
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
<script type="text/javascript">
new TradingView.widget(
{
"width": 980,
"height": 610,
"symbol": "COINBASE:ETHUSD",
"interval": "30",
"timezone": "Europe/Berlin",
"theme": "Light",
"style": "1",
"locale": "de_DE",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"save_image": false,
"hideideas": true,
"container_id": "tradingview_a691f"
}
);
</script>
</div>
<!-- TradingView Widget END -->
-------------------------------------------------------------------------
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
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?
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.
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?
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 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.