Dynamic Links in Spotfire

My friend asked me recently -
"I need to trigger a URL from Spotfire, where URL should change as per User inputs"
Interesting 🤓
Usually when people try doing it from IronPython webbrowser code, It doesn't work in Webplayer. So we need something which works everywhere 🙂
To do this, I will take a generic example. I will trigger a Google search query based on an Input field. Every time search query gets updated, the Search button will also change its whole code.
Lets start -
  1. Create a HTML Text Area with an Input field Property, and a DIV for holding our search button.
    <span id="query">
    <SpotfireControl id="041866e281b24b8fa9f839f91af7a30d" />
    </span>
    <br><br>
    <div id="trigger">
    </div>
  2. Now Add some extra code to making our search button as an actual button. You can use code below -
    <style id="AlienBox">
     .buttonSpan {
    background-color:chocolate !important;
    color: white !important;
    border: 1px solid white!important;
    border-radius: 2px 3px 3px 3px !important;
        font-variant: petite-caps;
    cursor:pointer;
    }
     </style>
    As usual, here is JS code to beat HTML sanitization -
    if(!$('#AlienBox').length){
     $('body').append($(`<style id="AlienBox">
     .buttonSpan {
    background-color:chocolate !important;
    color: white !important;
    border: 1px solid white!important;
    border-radius: 2px 3px 3px 3px !important;
        font-variant: petite-caps;
    cursor:pointer;
    }
     </style>`, {
            id: 'AlienBox' 
       })); 
    }
  3. Add this JavaScript to Text Area. Feel free to modify as per your need.
    function ChangeURL(){

    var q =$('#query input').val();
    var SearchString = "<span class='buttonSpan' onclick=\"location='https://www.google.com/search?q="+q+"'\"> Search Google for '"+q+"'</span>";
    $('#trigger').html(SearchString);
    }
    setInterval(ChangeURL,500)
  4. Done
This is how it looks for different inputs -
Clicking on these buttons will open a Web Browser with Dynamic URL if the Analysis is opened in Clint. From Webplayer, it simple loads the URL populated.
Share: