Форма предварительного заполнения URL

Question

Я использую следующий код для создания пользовательской HTML-формы (развернутой в виде веб-приложения) с помощью скрипта Google Apps:

function getData(a)
{
  var ts = Utilities.formatDate(new Date(), "GMT-6", "yyyy-MM-dd' 'HH:mm:ss");
  a.push(ts);
  SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Login').appendRow(a);
  return true;
}

function doGet()
{
  var html = HtmlService.createHtmlOutputFromFile('index');
  return html.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)

}

index.html

  <div id="data">
    <br />Text 1<input type="text" size="15" id="txt1" />
    <br />Text 2<input type="text" size="15" id="txt2" />
    <br />Text 3<input type="text" size="15" id="txt3" />
    <br />Text 4<input type="text" size="15" id="txt4" />
    <br /><input type="button" value="submit" id="btn1" />
  </div>
  <div id="resp" style="display:none;">
    <h1>Response</h1>
    <p>Your data has been received.</p>
  </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
      $(function() {
        $('#btn1').click(validate);
        $('#txt4').val('');
        $('#txt3').val('');
        $('#txt2').val('');
        $('#txt1').val('')
      });

      function setResponse(a)
      {
        if(a)
        {
          $('#data').css('display','none');
          $('#resp').css('display','block');
        }
      }

      function validate()
      {
        var txt1 = document.getElementById('txt1').value || ' ';
        var txt2 = document.getElementById('txt2').value || ' ';
        var txt3 = document.getElementById('txt3').value || ' ';
        var txt4 = document.getElementById('txt4').value || ' ';
        var a = [txt1,txt2,txt3,txt4];
        if(txt1 && txt2 && txt3 && txt4)
        {
          google.script.run
            .withSuccessHandler(setResponse)
            .getData(a);
            return true;
        }
        else
        {
          alert('All fields must be completed.');
        }
      }

      function loadTxt(from,to)
      {
          document.getElementById(to).value = document.getElementById(from).value;
      }

     console.log('My Code');
   </script>

Кодработает как ожидалось и собирает ответы в электронной таблице, однако я хотел бы предварительно заполнить некоторые поля, используя URL.Я знаю, что вы можете сделать это с обычной системой Google Forms.

Возможно ли это с URL-адресами веб-приложений?

Answer 1

Вы можете сделать это, отправив параметры запроса url:

https://script.google.com/macros/[ID]?txt1=value1&txt2=value2

Затем, onload, получите параметры запроса и обновите его в форме.

Пример фрагмента Index.html:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script>
    $(function() {
      google.script.url.getLocation(function(location) {
        var locObj = location.parameter;
        $('#btn1').click(validate);
        Object.keys(locObj).forEach((key) => {$("#"+key).val(locObj[key])})
      });
    });

Ссылки:

• google.script.url
• Рабочий пример для получения параметра запроса