How can I pick a range with a modeless dialog in Google Sheets App Scripts with mouse selection?

user_13215348 0
Viewed 83

I'm building a Google Sheet's add-on, for which I require to get the user to select a range using a modeless dialog, which then would be used by some other functions.

I've managed to get this solution to work correctly, but don't like the user experience of needing to click on a button to get the range copied to the input box.

Is there any way I can get users to input the range with their mouse, similar to what happens when want to create a chart using pure Google Sheets? Here's a video of the intended functionality.

Thanks!

google-apps-script google-sheets html javascript
1 Answers

You can do it with Web Polling, that is with setInterval()

Sample:

code.gs

function dialog()//run me
{
  var html=HtmlService.createHtmlOutputFromFile('index');
  SpreadsheetApp.getUi().showModelessDialog(html, 'Select a range');
}

index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <script>
  function onSuccess(range){
    console.log("onSuccess called");
    document.getElementById("range").innerHTML=range;
  }
  function polling(){
  console.log("polling called");
    setInterval( function(){google.script.run.withSuccessHandler(onSuccess).getValues()},500);
   }    
  </script>
  <body onload="polling()">
    <div> Range: </div>
    <div id="range">
    </div>
  </body>
</html>
user_115997890
Related