B4J Question BANANO api script injection problem

[tango]

append to a column element script give response nothing. any idea?

Case "tradingview"
            MainPageHolder.Element.Empty
            MainPageHolder.Element.LoadLayout("trview")
            SKColumn1kb.Element.Append($"<script Type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js" async>
            {
            "autosize": True,
            "symbol": "BIST": AKBNK,
            "interval": "W",
            "timezone": "Etc/UTC",
            "theme": "light",
            "style": "1",
            "locale": "tr",
            "enable_publishing": False,
            "hide_top_toolbar": True,
            "hide_legend": True,
            "allow_symbol_change": True,
            "save_image": False,
            "calendar": False,
            "support_host": "https://www.tradingview.com"
            }
            </script>"$)

 

[alwaysbusy]

HTML5 does not allow to add a script tag this way and run it. You must do it using CreateElement.

Extra notes:

1. your script code is not valid Json (be carefull with e.g. True and False, these are not valid json as they should be true and false)
2. your symbol is wrong ("symbol": "BIST": AKBNK is not valid json)
3. you better set the width and height of the chart in your json

    Dim body As BANanoElement
    body.Initialize("#body")
    
    ' create the script tag to be injected
    Dim tmpScriptElem As BANanoElement = BANano.CreateElement("script")
    ' set the src
    tmpScriptElem.SetAttr("src", "https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js")
    ' set the async
    tmpScriptElem.SetAttr("async", True)
    ' add the json the widget expects
    tmpScriptElem.Append($"{
            "width": "100%",
             "height": "500",
            "symbol": "BIST:AKBNK",
            "interval": "W",
            "timezone": "Etc/UTC",
            "theme": "light",
            "style": "1",
            "locale": "tr",
            "enable_publishing": false,
            "hide_top_toolbar": true,
            "hide_legend": true,
            "allow_symbol_change": true,
            "save_image": false,
            "calendar": false,
            "support_host": "https://www.tradingview.com"
            }"$)
    
    ' add the wrapping divs to the element you want to add the chart, here it is the body
    Dim tmpWidgetElem As BANanoElement = body.Append($"<!-- TradingView Widget BEGIN -->
    <div id="myWidget" class="tradingview-widget-container" style="width:100%">
          <div class="tradingview-widget-container__widget" style="width:100%"></div>
          <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>  
    </div>
    <!-- TradingView Widget END -->"$).Get("#myWidget")

    ' append the script element to the tmpWidgetElem element
    tmpWidgetElem.Append(tmpScriptElem)

Alwaysbusy