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");
});

即使我禁用了原始的侦听器，也永远不会触发。

那么，我怎么知道用户选择了哪个单选按钮？

注意：我确实需要表格内的单选按钮，因为表格的每一行都有其自己的单选按钮，可以为我提供关于每个表格的不同信息。

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>

Answer 2

我发现了可行的方法

我可以在单选按钮周围添加一个带有event.preventdefault代码的表单，然后调用一个函数：

int error = 0;
pit_t child_pid[2] = { -1, -1 };
for (int dir=0; dir<=1; ++dir) {
    child_pid[dir] = fork();
    if (child_pid[dir] == -1) {
        error = 1;
        perror("fork");
    }

    if (child_pid[dir] == 0) { 
       // Here is where you place the code the child should execute.
       exit(0);
    }
}

for (int dir=0; dir<=1; ++dir) {
    if (child_pid[dir] == -1)
       continue;

    int status;
    pid_t pid = waitpid(child_pid[dir], &status, 0);
    if (pid == -1) {
        error = 1;
        perror("waitpid");
    }
    else if (WIFSIGNALED(status)) {
        error = 1;
        fprintf(stderr, "Child was killed by signal %d\n", WTERMSIG(wstatus));
    }
    else if (WEXITSTATUS(status) != 0) {
        error = 1;
        fprintf(stderr, "Child exited with error %d\n", WEXITSTATUS(wstatus));
    }
}

if (error)
   exit(1);

然后在我的函数中，我要使用“ this”做任何我想做的事情。它以“ name = value”出现，因此很容易拆分和解析。

如何获取Google可视化表中的单选按钮的值

2 个答案: