skip to Main Content

I’m having fun at work and building a sheet with a bunch of little scripts (read: I’m a debutant that know a little bit appscript and html code). I succeeded to make a script to make a prompt box appear but I would like to add an image in the popup window.

Here’s my code so far:

function promptbox() {
  var ui = SpreadsheetApp.getUi();
  var result = ui.prompt(
     'Inscrire le No Projet à copier',
      ui.ButtonSet.OK_CANCEL);
}

I found that post about html and try the code as it is and works really well, although, I don’t know how to code html in my prompt box. I tried different things, but I didn’t succeed.

Is it possible to use html with a prompt box? If yes, how do I code my prompt box with html? If no, is it possible to simply add an image to a prompt box? If yes, how do I code my prompt box with an image? If no, oh well!

Thanks in advance!

2

Answers


  1. Hy Mole

    You can not use an HTML output in a prompt.
    Please have a look at the Ui class documentation: https://developers.google.com/apps-script/reference/base/ui

    Check on the methods the class has.

    HTML outputs(what you are trying to do) can only work on the following methods

    • showModalDialog(HTML, title)
    • showModelessDialog(HTML, title)
    • showSidebar(HTML)
    Login or Signup to reply.
  2. This will display an html dialog and then when you click display prompt a prompt will appear where you can respond with a value that will be displayed in a toast.

    function myfunction() {
      const ss = SpreadsheetApp.getActive();
      const ui = SpreadsheetApp.getUi();
      let body = '<form><input type="text" id="name" name="value" value="Please enter you name." readonly/><br><input type="button" value="Display Prompt" onclick="doStuff()" /></form>';
      let script = 'function doStuff(){ const v = document.getElementById("name").value;google.script.run.alert(v)}'
      let html = `<!DOCTYPE html><html><head><base target="_top"></head><body>${body}<script>${script}</script></body></html>`;
      ui.showModelessDialog(HtmlService.createHtmlOutput(html),"Dialog");
    }
    
    function alert(v) {
      let r = SpreadsheetApp.getUi().prompt(v);
      SpreadsheetApp.getActive().toast(r.getResponseText())
    }
    

    All of the html is embedded in the gs functions as simple strings.

    Modeless Dialog:

    enter image description here

    Modal Prompt:

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search