0 Replies Latest reply on Nov 19, 2015 11:34 AM by Stephen Hellyar

    API link to non Quick Filter Checkboxes using Multiple Values

    Stephen Hellyar

       

      I am trying to connect an API filter to a checkbox located on my page.


      I used "Multiple Datasource Filters with JS API" by Kovner as a "tutorial." Here is the link:  JavaScript API: Multi-data source filters I tried to modify the function to account for a single data source and a dashboard versus a worksheet.  It seems to work, BUT I can't seem to add multiple values to the filter - using the standard  ('Filter', ['Value 1','Value 2']) approach.

       

      Any ideas? 

       

       

       

      This is the example function

             

              function filterMyViz(region) { 

          // alert(region + ": " + $('#'+region).is(":checked"));

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

          var updateType;

          if($('#'+region).is(":checked")) {

              updateType = "ADD";

          } else {

              updateType = "REMOVE";

          }

          sheets.get("SuperStoreSales").applyFilterAsync('Region', region, updateType);

          sheets.get("CoffeeChainSales").applyFilterAsync('Market', region, updateType);

      }

       

      Here is my attempt to create a modified function to account for my workbook and single data source. 

             

      // My attempt

             

              function filterMainViz(filterName, values) {

              var sheet = mainViz.getWorkbook().getActiveSheet();

              var updateType;

              if($('#'+values).is(":checked"))    {

                  updateType = "ADD";

             

              } else {

                  updateType = "REMOVE";

              }

          

                  worksheetArray = sheet.getWorksheets();

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

                      worksheetArray[i].applyFilterAsync(filterName, values, updateType);

                  }

              }

       

      My HTML uses the same source model.

       

            <div class="checkbox">

                          <labeL><input type="checkbox" id="Soft Tacos" checked onclick="filterMainViz('Market','Soft')">Soft Tacos</labeL>

                      </div>

                      <div class="checkbox">

                          <labeL><input type="checkbox" id="Crunchy Tacos" checked onclick="filterMainViz('Market','Crunchy')">Crunchy Tacos</labeL>

                      </div>

                      <div class="checkbox">

                          <labeL><input type="checkbox" id="Check All" checked onclick="filterMainViz('Market',['Soft Tacos','Crunchy Tacos'])">Check All</labeL>

                      </div>

       

      Should I just forget this and add a function that checks all the boxes (and what would that look like)?