Как я могу получить значение переключателя внутри таблицы визуализации Google

Question

У меня есть таблица, которую я строю, используя обертку диаграммы следующим образом:

var rightWrapper;
function drawVisualization() {
  rightWrapper = new google.visualization.ChartWrapper({
  "chartType": "Table",
  'dataSourceUrl':'https://docs.google.com/spreadsheets/d/1I3N5DtdXGWFootaOCQM201K_ao2ZPWSWyw9_l7QcwQg/gviz/tq?sheet=User_my_crew&headers=1',
  'containerId':'target_table_div',
  'query':'SELECT A,B,C,D',
  'options': { 'width': 700, 'height': 500, 'allowHtml': true }
  });

  google.visualization.events.addListener(rightWrapper, 'ready', onRightReady);

  rightWrapper.draw();

  function onRightReady() {
    google.visualization.events.addListener(rightWrapper.getChart(), 'select', rightSelectionHandler);
  }

  function rightSelectionHandler() {
    var selection = rightWrapper.getChart().getSelection();
    if (selection.length == 1) {
      var item = selection[0];
      if (item.row != null) {
        alert("selected row " + item.row);
        var value = (rightWrapper.getSnapshot().getDataTable().getValue(item.row,3));
        alert(value);
      }
    } 
  }
}

И в этом столбце 3 у меня есть HTML для создания переключателей. К сожалению, фактический HTML хранится, и у меня, похоже, нет способа опроса, чтобы выяснить, какая радио-кнопка теперь проверена (getValue, перечисленный в коде выше, всегда показывает мне только HTML, который использовался для построения радио кнопки, а не какая из них сейчас "проверена").

К сожалению, кажется, что любые щелчки внутри этой таблицы должны быть обнаружены выбранным слушателем, и выбранный слушатель не передает никакой информации за пределы выбранной строки и столбца. Я попытался встроить функции изменения и щелчка, а также переключил s на своих переключателях. Например:

$("#radio").click(function(){  //also tried with .change
  alert("working");
});

Это никогда не сработает, даже если я отключу моего первоначального слушателя.

Итак, как я могу узнать, какую радио-кнопку выбрал мой пользователь?

Примечание: мне нужны переключатели внутри таблицы, так как каждая строка таблицы имеет свои собственные переключатели, чтобы предоставить мне различную информацию о каждом.

google-apps-script charts google-visualization

1

TulsaNewbie 31 Май 2019 в 01:39

Answer 1

Вам не нужна форма, вам просто нужно дождаться события 'ready' графика,
перед назначением события изменения.

См. следующий рабочий фрагмент,
выберите радио, чтобы увидеть имя и значение ...

google.charts.load('current', {
  packages: ['controls', 'table']
}).then(function () {
  var rightWrapper = new google.visualization.ChartWrapper({
    chartType: 'Table',
    dataSourceUrl: 'https://docs.google.com/spreadsheets/d/1I3N5DtdXGWFootaOCQM201K_ao2ZPWSWyw9_l7QcwQg/gviz/tq?sheet=User_my_crew&headers=1',
    containerId: 'target_table_div',
    query: 'SELECT A,B,C,D',
    options: { 'width': 700, 'height': 500, 'allowHtml': true }
  });

  google.visualization.events.addListener(rightWrapper, 'ready', onRightReady);

  rightWrapper.draw();

  function onRightReady() {
    $('input[type="radio"]').on('change', calcForm2);
  }
});

function calcForm2(sender) {
  console.log(sender.target.name, sender.target.value);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="target_table_div"></div>

1

WhiteHat 31 Май 2019 в 12:29

Answer 2

Я понял, что-то работает

Я могу добавить форму вокруг своих переключателей с кодом event.preventdefault и вызвать функцию:

<form name="myForm" onchange="event.preventDefault(); calcForm2(this);">...radiobuttons...</form>

Затем в своей функции я делаю все, что хочу с «этим». Он выглядит как «имя = значение», поэтому его довольно легко разделить и проанализировать.

0

TulsaNewbie 31 Май 2019 в 04:12

Как я могу получить значение переключателя внутри таблицы визуализации Google

2 ответа

Похожие вопросы

Новые вопросы

google-apps-script