Org Chart select event

Forums SPJS Charts for SharePoint Org Chart select event

Viewing 11 reply threads
  • Author
    Posts
    • #19190
      Phil Grant
      Participant

      Hi,
      It is possible to filter a sub chart from the master based on the filters used but is it possible to filter the sub chart based on a selection made in the master chart, this is in the Org Chart.

      I have a table chart view under the org chart view that has extra information shown and I would like to limit the table chart to the selected box in the org chart above.

      Cheers,
      Phil

    • #19214
      Alexander Bautz
      Keymaster

      Yes, you can use this custom js. You can put it in a script editor web part in the page where you have the chart or put it in a file and refer it in the “Load external JS or CSS” tab in the chart config. If you use a script editor web part you must wrap the code in a <script> tag.

      orgChartSelectHandler("YOUR_ORG_CHART_ID");
      function orgChartSelectHandler(id) {
          try {
              google.visualization.events.addListener(spjs.charts.data.charts[id], "select", function (e) {
                  var selection = spjs.charts.data.charts[id].getSelection(), data = spjs.charts.data.chartData[id], item, selectedItem = "";
                  for (var i = 0; i < selection.length; i++) {
                      item = selection[i];
                      selectedItem = data.getFormattedValue(item.row, 0);
                  }
                 jQuery("#ID_OF_FILTER_SELECT_IN_TABLE_CHART").val(selectedItem).trigger("change");
              });
          } catch (ignore) {
              setTimeout(function () {
                  orgChartSelectHandler(id);
              }, 1000);
          }
      }

      You must edit the snippet and replace “YOUR_ORG_CHART_ID” with the ID of your org chart, and “ID_OF_FILTER_SELECT_IN_TABLE_CHART” with the ID of the dropdown select filter above your table chart (you must set up a filter in the table chart configuration). To find the ID, right click the dropdown select and click “inspect”. You will find the ID attribute in the HTML code

      Let me know how this works out.

      Alexander

    • #19231
      Phil Grant
      Participant

      Thanks for that, I’ll give it a try, I’m just delving into your dynamic forms wrapper at the moment …. Brilliant.

      Thanks,
      Phil

    • #19341
      Phil Grant
      Participant

      Alexander,
      It worked a treat thanks, once I’d figured out the correct filter ID in the table.

      Phil

    • #20461
      Phil Grant
      Participant

      Alexander,
      I tried to use this method to link two Table charts together but can’t seem to get it working.
      Should this work the same or is it specific to orgCharts?

      Regards,
      Phil

    • #20483
      Alexander Bautz
      Keymaster

      Not sure how this works in a table chart actually – did you try to add an alert or console.log in the code to see if it triggers when you select a cell in your table?

      Alexander

    • #20496
      Phil Grant
      Participant

      Sorry but I just don’t have the Javascript skill to sort this out, I looked into the Google help and there does seem to be a difference between charts and tables.

      I tried to get an alert and depending were I put it I could get it appearing constantly , even when nothing was clicked or never.

      Regards,
      Phil

    • #20506
      Alexander Bautz
      Keymaster

      I tested and the function does work, but what is it you want to send to the other table? – do you want to use the selected cell value as a filter in the other table filter controls (dropdown select) like the example with the org chart?

      Alexander

    • #20512
      Phil Grant
      Participant

      Yes, I have a list in a table view with DFFS and vLookup to another list with defined actions linked to the master list.
      I want to have a table with all the items from the master list and have a table showing the linked actions below an limit the actions shown when the row in the top table is selected.

      • #20534
        Alexander Bautz
        Keymaster

        I’m not sure this is the best way to do it. Have you tried connecting the list views?

        To do this, add a list view of both lists to a web part page. Then edit the page, and on the child list, choose “Connection” from the dropdown and select “Get filter value from” and select the parent list view. Select which field to send from the parent to the child and finish the connection. When this is done, click the “select” icon in the parent list to filter the child list.

        Alexander

    • #20540
      Phil Grant
      Participant

      Unfortunately the “connections” option is greyed out ??
      Just realised, you meant raw lists not SPJS table charts, DOH! yes that seems to work but not as nice looking as the SPJS view.

      • This reply was modified 6 years ago by Phil Grant.
    • #20546
      Phil Grant
      Participant

      Unfortunately the raw sharepoint list view is no good because the notes field shows “View entries” instead of the text.

    • #20596
      Alexander Bautz
      Keymaster

      When using the built in append functionality, your comments are stored in different versions of the list item, and I don’t think the data pulled in by the Charts query shows the full text either – or have you tested it and found that it does?

      Maybe you can change the method used to append to a normal text field like discussed here: https://spjsblog.com/forums/topic/display-appended-multiline-field-history-in-email-body/#post-20594

      Alexander

Viewing 11 reply threads
  • You must be logged in to reply to this topic.