3 Replies Latest reply on Nov 11, 2015 9:33 PM by Yongyuth Songsiridej

    Using Tableau Javascript API on Tableau Dashboard Loaded through aspx

    Yongyuth Songsiridej

      I have a non-public Tableau Dashboard that I load through aspx file, which supplies the required authentication, username and password, and allows the site visitor to view the tableau on the website, with the ticket it receives.

      So, now, I want the Tableau to load directly on the website with filters already applied through the Javascript API.

      Or, how can I use the "onFirstInteractive" option of the Javascript?
      The problem is I don't need to use the Javascript API to load the Tableau nor specify the div where tableau loads but just need it to apply filters on the Dashboard, and the "options" panel.

      P.S., I posted this same question on the public forum but I think this one is more appropriate group.

       

      function tableauFilter (){
      var placeholderDiv = document.getElementById("viz2"); // Don't need this
      var url = "https://public.tableau.com/views/Test_1228/Dashboard1" // Don't need this either
      var options = {
      onFirstInteractive
      : function(FilterName,Value){   //This is what I want to be able to use 
        activesheet
      = viz.getWorkbook().getActiveSheet();

        • 1. Re: Using Tableau Javascript API on Tableau Dashboard Loaded through aspx
          Thomas McCullough

          Hi Yongyuth,


          You can actually run any filter function after initializeViz(), which instantiates the embedded viz, instead of within onFirstInteractive()--though you'll want to declare your sheets variable here.  Just put any filter functions within the document ready.

           

          The following works well:

           

          ....something something

              onFirstInteractive: function() {

                    workbook = viz.getWorkbook();

                    activeSheet = workbook.getActiveSheet();

                    sheets = viz.getWorkbook().getActiveSheet().getWorksheets();

              }

          };

          viz = new tableauSoftware.Viz(placeholderDiv, vizUrl, options);

          }

          initializeViz();

           

                 for (var i=0; i < sheets.length; i++) {

                    sheets[i].applyFilterAsync(filterName, filterValues, 'replace');

                 }

           

          Hope this helps,


          Tom

          InterWorks

          1 of 1 people found this helpful
          • 2. Re: Using Tableau Javascript API on Tableau Dashboard Loaded through aspx
            Derrick Austin

            Hey Yongyuth,

             

            A followup to Tom, you will definitely have to load the Tableau view with the API instead of using an embed function.

             

            The JavaScript API can not attach to a visualization that it did not embed on the page.

             

            Derrick Austin

            1 of 1 people found this helpful
            • 3. Re: Using Tableau Javascript API on Tableau Dashboard Loaded through aspx
              Yongyuth Songsiridej

              Thank you for your comments. My question were answered by these following script:

               

              var myFilterValue;

              function InitialViz(myFilterValue)  {

               

                var placeholderDiv = document.getElementById("myVizDiv");

                var url = "myDashboardURL";

                var options = {

                  width: '800px',

                  height: '640px',

                 MyFilterName: myFilterValue,

                  onFirstInteractive: function () {

                    workbook = viz.getWorkbook();

                    activeSheet = workbook.getActiveSheet();

                  }

                };

               

                viz = new tableau.Viz(placeholderDiv, url, options);

               

              }