0
290
VistasHow to Pass value through URL to Html page (contain js snippet)?
I'm using Low-code platform based on Flutter to develop my app and that platform have Built-in widgets such as (WebView widget "accepts URL") and planning to use it to display Tradingview Widgets
Platform
The widget
singalticker.html Code
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/EURUSD/?exchange=FX" rel="noopener" target="_blank"><span class="blue-text">EURUSD Rates</span></a> by TradingView</div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>
{
"symbol": "FX:EURUSD",
"width": 350,
"colorTheme": "light",
"isTransparent": false,
"locale": "en"
}
</script>
</div>
<!-- TradingView Widget END -->So, I've managed to create a html page in GitHub and publish it and then placed its URL in the WebView and its works BUT what I'm asking is how to pass a value through the URL to change the pair
"symbol": "FX:EURUSD",
so when the user choose a pair of (Stock/Fiat) the html page changes depends on that ? I've tried following multiple solutions here but nothing works !
Any help in this matter will be appreciated thanks
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
With this you can get query variable from URL string;
// add this function in your page script
function GetQueryVar(variable) {
var query = window.location.search.substring(1)
var vars = query.split('&')
for (var i = 0; i < vars.length; i++) {
var qPair = vars[i].split('=');
if (decodeURIComponent(qPair[0]).toLowerCase() == variable.toLowerCase())
return decodeURIComponent(qPair[1]);
}
}
How to use:
// url is: https://siteurl.com/page?fx=EURUSD
const fx = GetQueryVar('FX') // fx == 'EURUSD'
UPDATE 1
<body>
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget"></div>
<div class="tradingview-widget-copyright" id="view"></div>
</div>
<script type="text/javascript">
function getParameterByName(name, url = window.location.href) {
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
const container = document.getElementById("view")
const symbol = getParameterByName('fx')
document.addEventListener('DOMContentLoaded', function () {
var iframe = document.createElement('iframe')
iframe.setAttribute(
'src',
`https://s.tradingview.com/embed-widget/single-quote#{"width":350,"symbol":"FX:${symbol}","isTransparent":false,"height":126,"utm_source":"","utm_medium":"widget","utm_campaign":"single-quote"}`,
);
iframe.setAttribute('scrolling', 'no')
iframe.setAttribute('allowtransparency', 'true')
iframe.setAttribute('frameborder', 0)
iframe.setAttribute('style', 'box-sizing: border-box; height: calc(94px); width: 350px;')
container.appendChild(iframe)
});
</script>
</div>
</body>
·
Juan Pablo Isaza
Denunciar
Responde la pregunta