Using Google Picker with Google Apps Script

The Google Picker API lets you select files and folders in Google Drive visually. It can used inside Google Spreadsheet, Google Docs or a standalone HTML web app.

Here’s a snippet that will let user select one or more Drive folders with the Google File Picker API bound inside a Google Spreadsheet. The dialog window only shows the Folders list and all the other files in the Drive stay hidden. When the user selects a folder, the ID of the Drive folder is printed else the dialog is closed.


// See:

function onOpen() {
  SpreadsheetApp.getUi().createMenu('Google Picker')
      .addItem('Choose Folder', 'showPicker')

 * Displays an HTML-service dialog in Google Sheets that contains client-side
 * JavaScript code for the Google Picker API.
function showPicker() {
  var html = HtmlService.createHtmlOutputFromFile('Picker.html')
  SpreadsheetApp.getUi().showModalDialog(html, 'Select Folder');

function getOAuthToken() {
  return ScriptApp.getOAuthToken();

Also save this file as “Picker.html” inside the Google Apps Script project.

<!DOCTYPE html>
  <link rel="stylesheet" href="">
  <script type="text/javascript">
        width: 600,
        height: 425
    var pickerApiLoaded = false;

    function onApiLoad() {
        gapi.load('picker', {
            'callback': function() {
                pickerApiLoaded = true;

    function createPicker(token) {

        if (pickerApiLoaded && token) {

            var docsView = new google.picker.DocsView()

            var picker = new google.picker.PickerBuilder()
                .setSize(DIALOG_DIMENSIONS.width - 2, DIALOG_DIMENSIONS.height - 2)


        } else {
            showError('Unable to load the file picker.');

     * A callback function that extracts the chosen document's metadata from the
     * response object. For details on the response object, see
     * @param {object} data The response object.
    function pickerCallback(data) {
        var action = data[google.picker.Response.ACTION];
        if (action == google.picker.Action.PICKED) {
            var doc = data[google.picker.Response.DOCUMENTS][0];
            var id = doc[google.picker.Document.ID];
            // Show the ID of the Google Drive folder
            document.getElementById('result').innerHTML = id;
        } else if (action == google.picker.Action.CANCEL) {

    function showError(message) {
        document.getElementById('result').innerHTML = 'Error: ' + message;

        <p id='result'></p>
    <script type="text/javascript" src=""></script>

The upcoming release of Save Gmail attachments will include the Google Picker API to help users easily select the Google Drive folder for saving the file attachments.