[Google Forms] JavaScript Sample Code to Get Radio Button, Checkbox, and Dropdown Options

Tadashi Shigeoka ·  Thu, October 25, 2018

I’ll introduce JavaScript sample code to get radio button, checkbox, and dropdown options from Google Forms.

G Suite - 旧 Google Apps

Google Forms Prerequisites

For this article, I created a Google Forms sample. Based on this, I’ll introduce JavaScript snippets and execution results.

Getting Google Forms Options

Here’s the JavaScript sample code to output radio button, checkbox, and dropdown options from Google Forms:

var outputs = [];

var items = document.querySelectorAll('[data-item-id]');
[].forEach.call(items, function(item) {
  // Display each question title
  [].forEach.call(
    item.getElementsByClassName('exportItemTitle'),
    function(itemTitle) {
      outputs.push(itemTitle.textContent);
    }
  );

  // Display radio button / checkbox options
  [].forEach.call(
    item.getElementsByClassName('exportLabel'),
    function(label) {
      outputs.push(label.textContent);
    }
  );

  // Display dropdown options
  [].forEach.call(
    item.getElementsByClassName("exportOption"),
    function(option) {
      outputs.push(option.textContent);
    }
  );
});

console.log(outputs.join('\
'));

JavaScript Sample Code Execution Results

Here’s a screenshot of the output results when executing JavaScript in the Chrome Developer Tool console.

Google フォームのラジオボタン、チェックボックス、プルダウンの選択肢取得

That’s all about wanting to get Google Forms options with JavaScript from the Gemba.