Сделать всплывающее окно в гугл таблице

Обновлено: 24.04.2024

Как создать всплывающее окно в Google Sheets с помощью редактора сценариев? Я хочу показать всплывающее окно с персонализированным уведомлением.

Оно должно начинаться следующим образом:

Сценарии, привязанные к Документам, Таблицам или Формам Google, могут отображать несколько типов элементов пользовательского интерфейса - предварительно созданные предупреждения и подсказки, а также диалоги и боковые панели, которые содержат пользовательские HTML-службы или служебные страницы пользовательского интерфейса. Как правило, эти элементы открываются из меню элементов. (Обратите внимание, что в Google Forms элементы пользовательского интерфейса видны > только редактору. только редактору, который открывает форму для ее изменения, а не пользователю, который > открывает форму, чтобы ее > изменить. открывает форму для ответа).

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

Диалоги оповещений

Нестандартный диалог

Из [2] (перейдите по ссылке в ссылках, чтобы получить доступ к ссылкам в цитируемом тексте)

Служба HTML позволяет вам обслуживать веб-страницы, которые могут взаимодействовать с. функциями Apps Script на стороне сервера. Она особенно полезна для создания веб-приложений или добавления пользовательских интерфейсов в Google Docs, Sheets и Forms. Вы даже можете использовать его для создания тела письма. электронного письма.

Создание HTML-файлов

Предоставление HTML в качестве пользовательского интерфейса Google Docs, Sheets или Forms

Служба HTML может отображать диалоговое окно или боковую панель в Google Docs, Sheets или Forms, если ваш сценарий привязан к контейнеру файла. (В Google Forms пользовательские интерфейсы видны только редактору, который > открывает форму. открывает форму для ее изменения, а не для пользователя, который открывает форму, чтобы > ответить). ответить.)

В отличие от веб-приложения, скрипт, создающий пользовательский интерфейс для документа, электронной таблицы или формы, не нуждается в функции doGet() . специально, и вам не нужно сохранять версию вашего скрипта или развертывать его. Вместо этого функция, открывающая пользовательский интерфейс, должна > передавать ваш HTML-файл. передать ваш HTML-файл как объект HtmlOutput в функцию showModalDialog()) . или showSidebar() методов объекта Ui для активного документа, формы или электронной таблицы.

Эти примеры включают несколько дополнительных функций для удобства: метод onOpen() функция создает пользовательское меню, облегчающее открытие > интерфейса, а функция onOpen() создает пользовательское меню, облегчающее открытие > интерфейса. интерфейс, а кнопка в HTML-файле вызывает специальный close() . метод API google.script.host для закрытия интерфейса.

Как создать всплывающее окно в Google Таблицах с помощью редактора сценариев? Я хотел бы показать всплывающее окно с персонализированным уведомлением.

Он должен начинаться следующим образом:

2 ответа

Скрипты, связанные с Документами, таблицами или формами Google, могут отображаться несколько типов элементов пользовательского интерфейса - предустановленные оповещения и подсказки, а также диалоги и боковые панели, которые содержат пользовательский HTML-сервис или Пользовательские страницы пользовательского интерфейса. Как правило, эти элементы открываются из меню Предметы. (Обратите внимание, что в Google Forms элементы пользовательского интерфейса видны только редактору, который открывает форму для его изменения, а не пользователю, который открывает форму для ответа.)

В основном есть две альтернативы для всплывающих окон, запускаемых из пользовательского меню: диалоговые окна предупреждений и пользовательские диалоги

Диалоговое окно оповещений

Пользовательский диалог

Из [2] (следуйте ссылке в ссылках, чтобы получить доступ к ссылкам в цитируемом тексте)

Служба HTML позволяет обслуживать веб-страницы, которые могут взаимодействовать с серверные функции скриптов приложений. Это особенно полезно для создание веб-приложений или добавление пользовательских интерфейсов в Документы Google, Листы и формы. Вы можете даже использовать его для генерации тела электронная почта.

Создать HTML-файлы

Служить HTML как пользовательский интерфейс Google Документов, Таблиц или форм

Служба HTML может отображать диалоговое окно или боковую панель в Документах Google, Таблицы или Формы, если ваш скрипт связан с контейнером с файлом. (В Google Forms, пользовательские пользовательские интерфейсы видны только редактору, который открывает форму для ее изменения, а не для пользователя, который открывает форму ответить.)

В отличие от веб-приложения, скрипт, создающий пользовательский интерфейс для документ, электронная таблица или форма не нуждаются в функции doGet() в частности, и вам не нужно сохранять версию вашего скрипта или разверните его. Вместо этого функция, открывающая пользовательский интерфейс, должна передайте свой HTML-файл как объект HtmlOutput в код showModalDialog()) или showSidebar() объекта Ui для активного документа, формы или таблицы.

Эти примеры включают в себя несколько дополнительных функций для удобства: Функция onOpen() создает пользовательское меню, которое позволяет легко открыть интерфейс, а кнопка в файле HTML вызывает специальный close() метод API google.script.host для закрытия интерфейса.

Scripts that are bound to Google Docs, Sheets, or Forms can display several types of user-interface elements — pre-built alerts and prompts, plus dialogs and sidebars that contain custom HTML service pages. Typically, these elements are opened from menu items. (Note that in Google Forms, user-interface elements are visible only to an editor who opens the form to modify it, not to a user who opens the form to respond.)

Alert dialogs


An alert is a pre-built dialog box that opens inside a Google Docs, Sheets, Slides, or Forms editor. It displays a message and an "OK" button; a title and alternative buttons are optional. It is similar to calling window.alert() in client-side JavaScript within a web browser.

Alerts suspend the server-side script while the dialog is open. The script resumes after the user closes the dialog, but JDBC connections do not persist across the suspension.

As shown in the example below, Google Docs, Forms, Slides, and Sheets all use the method Ui.alert() , which is available in three variants. To override the default "OK" button, pass a value from the Ui.ButtonSet enum as the buttons argument. To evaluate which button the user clicked, compare the return value for alert() to the Ui.Button enum.

Prompt dialogs


A prompt is a pre-built dialog box that opens inside a Google Docs, Sheets, Slides, or Forms editor. It displays a message, a text-input field, and an "OK" button; a title and alternative buttons are optional. It is similar to calling window.prompt() in client-side JavaScript within a web browser.

Prompts suspend the server-side script while the dialog is open. The script resumes after the user closes the dialog, but JDBC connections do not persist across the suspension.

As shown in the example below, Google Docs¸ Forms, Slides, and Sheets all use the method Ui.prompt() , which is available in three variants. To override the default "OK" button, pass a value from the Ui.ButtonSet enum as the buttons argument. To evaluate the user's response, capture the return value for prompt() , then call PromptResponse.getResponseText() to retrieve the user's input, and compare the return value for PromptResponse.getSelectedButton() to the Ui.Button enum.

Custom dialogs


A custom dialog can display an HTML service user interface inside a Google Docs, Sheets, Slides, or Forms editor.

Custom dialogs do not suspend the server-side script while the dialog is open. The client-side component can make asynchronous calls to the server-side script using the google.script API for HTML-service interfaces.

The dialog can close itself by calling google.script.host.close() in the client side of an HTML-service interface. The dialog cannot be closed by other interfaces, only by the user or itself.

As shown in the example below, Google Docs, Forms, Slides, and Sheets all use the method Ui.showModalDialog() to open the dialog.

Code.gs

Page.html

Custom sidebars


A sidebar can display an HTML service user interface inside a Google Docs, Forms, Slides, or Sheets editor.

Sidebars do not suspend the server-side script while the dialog is open. The client-side component can make asynchronous calls to the server-side script using the google.script API for HTML-service interfaces.

The sidebar can close itself by calling google.script.host.close() in the client side of an HTML-service interface. The sidebar cannot be closed by other interfaces, only by the user or itself.

As shown in the example below, Google Docs, Forms, Slides, and Sheets all use the method Ui.showSidebar() to open the sidebar.

Code.gs

Page.html

File-open dialogs

Google Picker is a "file-open" dialog for information stored in Google servers, including Google Drive, Google Image Search, Google Video Search, and more.

As shown in the example below, Picker's client-side JavaScript API can be used in HTML service to create a custom dialog that lets users select existing files or upload new ones, then pass that selection back to your script for further use.

To enable Picker and obtain an API key, follow these instructions:

In the referer section that appears, add these URLs as referers, then click Save:

In the Credentials tab, copy the API key you created for use below, then return to the script editor and click Close to close the dialog.

You must call setOrigin(google.script.host.origin) when constructing the PickerBuilder .

Основная цель раскрывающихся списков в Google Таблицах — предлагать варианты, из которых пользователь может выбирать. Это дает пользователям четкое представление обо всех доступных параметрах, а также гарантирует, что пользователь выбирает только разрешенные элементы.


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

Таблицы Google позволяют нам с легкостью использовать эту функцию. Всего за несколько щелчков мышью вы можете создать раскрывающийся список с одной ячейкой или заполнить всю строку или столбец раскрывающимися списками.

Однако вы заметите, что раскрывающийся список Google Таблиц по умолчанию позволяет пользователю выбрать только один элемент из списка.

Часто вам может потребоваться выбрать более одного варианта в раскрывающемся списке . Например, если есть набор цветов, из которого вы можете выбрать, вам может понравиться более одного цвета.

Или может захотеться получить список языков программирования, которыми владеет пользователь. В таких случаях возможно, что пользователь знает более одного, и необходимо выбрать несколько вариантов из раскрывающегося списка .

Поэтому множественный выбор в раскрывающихся списках может быть весьма полезным. К сожалению, эта опция традиционно не разрешена в Google Таблицах. Вам разрешен только один вариант за раз.


Хорошая новость в том, что есть способ обойти это. Можно сделать ваш раскрывающийся список допускающим множественный выбор с помощью Google AppScript.


В этой статье я покажу вам, как создать раскрывающийся список, в котором можно выбрать несколько вариантов (как показано ниже).

Но сначала начнем с нуля.

Начнем с создания нового раскрывающегося списка из списка вариантов цвета.

Разрешение множественного выбора в раскрывающемся списке (с повторением)

В этом руководстве я буду использовать следующий набор данных элементов и создам раскрывающийся список в ячейке C1.

Чтобы создать раскрывающийся список, допускающий множественный выбор, вам нужно сделать две вещи:

  • Создайте раскрывающийся список, используя список элементов
  • Добавьте в редактор скриптов функцию, которая позволит выбрать несколько вариантов в раскрывающемся списке.

Давайте подробно рассмотрим каждый из этих шагов.

Создание выпадающего списка

Предположим, у меня есть набор данных элементов, как показано ниже, и я хочу создать раскрывающийся список в ячейке C1.

Ниже приведены шаги для этого:

  • Выберите ячейку C1 (ту, в которой вы хотите раскрывающийся список)
  • В меню выберите параметр «Данные».
  • Нажмите на проверку данных.
  • В диалоговом окне «Проверка данных» убедитесь, что «Диапазон ячеек» относится к ячейке, в которой вы хотите раскрыть раскрывающийся список.
  • В разделе «Критерии» выберите «Список из диапазона», а затем выберите диапазон, содержащий элементы, которые вы хотите отобразить, в раскрывающемся списке.
  • Нажмите на Сохранить

Теперь выпадающий список появится в выделенной ячейке (в данном примере C1). Когда вы нажмете на стрелку, вы увидите свой список опций.


Обратите внимание, что вам разрешено выбирать только один вариант за раз.

Теперь позвольте мне показать вам, как преобразовать этот раскрывающийся список (который позволяет отображать только один элемент в ячейке) в тот, который позволяет выбирать несколько элементов. А для этого вам нужно добавить скрипт функции в редактор скриптов Google Таблиц.

Добавление скрипта Google Apps для включения множественного выбора

Ниже приведен код сценария, который вам придется скопировать и вставить в редактор сценариев (шаги, указанные ниже в разделе после кода):

Ниже приведены шаги по добавлению этого кода сценария в бэкэнд Google Таблиц, чтобы раскрывающийся список, который мы создали в ячейке C1, мог позволить выбрать более одного варианта:

Теперь вернитесь к рабочему листу и попробуйте выбрать несколько вариантов в раскрывающемся списке. Например, сначала выберите Apple, а затем выберите Banana.

Вы заметите, что это занимает секунду (иногда две секунды), а затем отображаются оба выбранных элемента (разделенных запятой).

Примечание. В правом верхнем углу ячейки вы увидите красный треугольник. Это может выглядеть как ошибка (поскольку значение в ячейке не соответствует ожидаемому). Вы можете спокойно игнорировать это.

Также обратите внимание, что с помощью этого кода он позволит вам выбрать один и тот же элемент дважды. Например, если вы выберете Apple, а затем снова выберете Apple, он дважды отобразит это в ячейке.

Если вы хотите создать раскрывающийся список, который позволяет выбирать несколько вариантов без повторения, я предоставил код позже в этом руководстве.


Как работает код?

Попробуем разобраться в этом коде по частям.

Код начинается со строки

onEdit () — это специальная функция в Google Таблицах. Она также известна как обработчик событий. Эта функция запускается каждый раз при изменении вашей электронной таблицы.

Мы хотим, чтобы наш код множественного выбора запускался каждый раз, когда элемент выбирается из раскрывающегося списка, поэтому имеет смысл поместить наш код в функцию onEdit ().

Теперь AppScript передает эту функцию как объект события в качестве аргумента. Обычно объект события называется e. Этот объект события содержит информацию о инициированном событии.

Если вы знакомы с основами AppScript, вы обнаружите, что первые четыре строки довольно легко понять:

Я объявил две переменные — одну (oldValue), которая будет содержать старое значение ячейки, и другую (newValue), которая будет содержать новое значение ячейки.

Переменная activeCell будет содержать текущую активную ячейку, которая была отредактирована.


Теперь мы не хотим, чтобы код запускался каждый раз при редактировании какой-либо ячейки. Мы хотим, чтобы он запускался только при редактировании ячейки CA1 Sheet1. Поэтому мы убеждаемся в этом, используя оператор if:

Приведенный выше код проверяет номер строки и столбца активной ячейки и имя листа. Поскольку раскрывающийся список находится в ячейке C1, он проверяет, равен ли номер строки 1 или нет, а также равен ли номер столбца 3 или нет.

Код в операторе IF выполняется только при соблюдении всех этих трех условий.

Ниже приведен код, который выполняется, когда мы находимся в правой ячейке (C1 в нашем примере).

e.oldValue также является свойством объекта события, e. Это содержит предыдущее значение активной ячейки. В нашем случае это будет значение до того, как мы сделаем выпадающий выбор.

Мы хотим присвоить это переменной oldValue.

e.value — это свойство объекта события, e. В нем хранится текущее значение активной ячейки. Мы хотим присвоить это переменной newValue.

Во-первых, давайте посмотрим, что произойдет, если не выбран ни один из вариантов. В этом случае e.value будет неопределенным. Когда это происходит, мы не хотим, чтобы в ячейке A1 отображалось что-либо. Поэтому мы помещаем в ячейку пустое значение.

Это также будет иметь место, если пользователь решит удалить все предыдущие выборы и перезапустить с нуля.


Если пользователь выберет опцию, то будут выполнены строки, следующие за оператором else. Теперь мы хотим указать, что делать, если опция выбирается в первый раз из раскрывающегося списка.

Это означает, что e.oldValue не определено. Когда это происходит, мы хотим, чтобы в ячейке A1 отображался только выбранный параметр (newValue).

Наконец, мы указываем, что делать в следующий раз, когда будет выбран вариант. Это означает, что и e.value, и e.oldValue содержат определенные значения.

Как только вы наберете код, сохраните его, а затем попробуйте выбрать несколько вариантов из раскрывающегося списка. Вы увидите, что все выбранные вами параметры отображаются один за другим, разделенные запятыми.

Если вы допустили ошибку, вы всегда можете очистить ячейку и начать заново. Когда это происходит, мы хотим отобразить как предыдущие значения, так и новое выбранное значение в ячейке A1, разделенные запятыми.

Примечание. Когда вы используете приведенный выше код, он не позволит вам вернуться и отредактировать часть строки. Например, если вы хотите вручную отредактировать строку элемента или удалить ее часть, вы не сможете этого сделать. Вам придется удалить все содержимое ячеек и начать заново, если вы хотите внести какие-либо изменения.

Однако здесь есть небольшая проблема. Обратите внимание, что если вы выберете элемент более одного раза, он снова будет внесен в ваш список выбора. Другими словами, повторение разрешено. Но обычно мы этого не хотим.

Ниже я подробно рассказал, как вы можете внести изменения в свой код, чтобы элемент можно было выбрать только один раз, чтобы не было повторов.

Разрешение множественного выбора в раскрывающемся списке (без повторения)

Ниже приведен код, который позволит выбрать несколько вариантов в раскрывающемся списке без повторений.


В приведенном выше коде я снова использую в качестве примера ячейку C1 на листе Sheet1. Если раскрывающийся список находится в другой ячейке (или листе), вам необходимо соответствующим образом скорректировать код.

Приведенная ниже часть кода позволяет нам игнорировать любое повторяющееся значение в раскрывающемся списке:

Здесь функция indexof () проверяет, содержит ли строка в oldValue строку в newValue.

Если это так, то он вернет индекс строки в oldValue. В противном случае он вернет значение меньше 0.

Если вновь выбранная опция действительно существует в нашем списке, мы хотим оставить список как есть (поэтому мы заполняем ячейку C1 предыдущим значением). Если нет, то мы хотим добавить вновь выбранный параметр в список с запятой (‘,’) и отобразить его в ячейке C1.

Множественный выбор в раскрывающемся списке (весь столбец или несколько ячеек)

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

Если вы хотите, чтобы раскрывающийся список позволял выбрать несколько элементов во всем столбце C, вам необходимо заменить следующую строку кода:

со следующей строкой кода:

Когда вы это делаете, мы только проверяем, равен ли столбец 3 или нет. Любые ячейки, которые находятся на листе Sheet1 и в столбце 3, будут удовлетворять этому критерию IF, и любой раскрывающийся список в нем допускает множественный выбор.


Точно так же, если вы хотите, чтобы это было доступно для всего столбца C и F, используйте вместо этого следующую строку:

Вышеупомянутая строка использует условие ИЛИ в операторе IF, где проверяется, равен ли номер столбца 3 или 6. Если ячейка с раскрывающимся списком находится в столбце C или F, будет разрешен выбор нескольких элементов.

Точно так же, если вы хотите, чтобы это было включено для нескольких ячеек, вы также можете сделать это, изменив код.

Вот как вы можете включить множественный выбор в раскрывающемся списке в Google Таблицах. Хотя это недоступно в качестве встроенной функции, вы можете легко сделать это с помощью магии Google Apps Script.

Программное обеспечение для работы с электронными таблицами, такое как Google Таблицы, может быть весьма чувствительным к различиям в форматах даты, поэтому всегда лучше выбирать дату из календаря в реальном времени, а не печатать ее.


В этом руководстве мы покажем вам, как вставить средство выбора даты в Google Таблицы, чтобы пользователь мог выбрать нужную дату во всплывающем календаре.

Зачем вставлять средство выбора даты в Google Таблицы?

Использование средства выбора даты в Google Таблицах дает множество преимуществ:

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

Когда появляется средство выбора даты в Google Таблицах?

Средство выбора даты появляется всякий раз, когда пользователь дважды щелкает ячейку, содержащую значение даты. Однако, чтобы это сработало, вам необходимо вставить действительную дату в ячейку Google Таблиц.


В качестве альтернативы вы можете просто ввести любое число в ячейку, преобразовать ячейку в формат даты (перейдя в Формат-> Число-> Дата), а затем дважды щелкнуть ячейку. В результате рядом с отформатированной ячейкой появится средство выбора даты.


Как вставить средство выбора даты в Google Таблицы

Один из способов мгновенно отобразить всплывающий календарь или средство выбора даты — ввести дату в ячейку в правильном формате, а затем дважды щелкнуть по ячейке. Это приведет к появлению всплывающего календаря рядом с ячейкой, позволяющего выбрать нужную дату.


Однако мы обычно предпочитаем, чтобы в ячейке даты отображалось средство выбора даты, даже если оно пустое. Например, может понадобиться пользователю ввести дату и конечную дату начала использования выбора даты, чтобы убедиться , что они ввели правильную дату в правильном формате (скажем, если вы хотите рассчитать количество дней между двумя датами ).


Для этого мы можем использовать функцию проверки данных Google Таблиц следующим образом:

  • Щелкните ячейку или диапазон ячеек, для которых вы хотите включить всплывающий календарь или средство выбора даты.
  • В меню «Данные» перейдите к «Проверка данных».



  • Щелкните стрелку раскрывающегося списка рядом с «Критериями:» и выберите параметр «Дата» из раскрывающегося списка.


  • В поле «Недопустимые данные:» установите переключатель «Отклонить ввод».


Примечание . Вы можете добавить всплывающую заметку к ячейке, предлагая пользователю дважды щелкнуть ячейку, чтобы увидеть календарь.

Теперь вы можете увидеть средство выбора даты, просто дважды щелкнув ячейку (я), в которую вы добавили проверку данных.


В этом руководстве мы показали вам, как вставить средство выбора даты в Google Таблицы, когда действительная дата уже введена в ячейку.

Мы также показали вам, как использовать проверку данных, чтобы в определенных ячейках всегда отображалось средство выбора даты, когда пользователь дважды щелкает по ячейке.

Читайте также: