GAS PropertiesService для сохранения и возврата порядка сортировки - PullRequest
Новая
       9

GAS PropertiesService для сохранения и возврата порядка сортировки

0 голосов
/ 21 февраля 2019

ВОПРОС

Как я могу использовать PropertiesService для хранения массива из index.html, отправить массив в code.gs и вернуть массив в index.html?

СПЕЦИАЛЬНЫЙ СЛУЧАЙ

В веб-приложении Google у меня есть группа сортируемых списков (созданных с помощью сортируемого пользовательского интерфейса JQuery).Я хочу сохранить самый последний ордер / позицию каждого li.Я пытаюсь, чтобы этот ордер / позиция «сохранялись», когда страница обновляется или закрывается.

ПРИМЕР

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

ГДЕ Я ПРОБЛЕМА

Я могу отобразить массив в консоли, но не знаю, как его вернутьcode.gs.Я думаю, что сейчас, но я не уверен.Кроме того, я не знаю, как «прочитать» это PropertiesService, чтобы массив возвращался к index.html.Я не совсем уверен, что я делаю, если кто-то может медленно идти по мне, это будет оценено!

АЛЬТЕРНАТИВЫ

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

ПОЛНЫЙ КОД (примечание: элементы списка формируются с использованием массива, поэтому они здесь не отображаются): https://jsfiddle.net/nateomardavis/Lmcjzho2/1/

ЧАСТИЧНЫЙ КОД

code.gs 

function doGet() {
  return HtmlService.createHtmlOutputFromFile('index');
}

function webAppTest() {
  getTeamArray();
}

function getTeamArray() {

  var ss = SpreadsheetApp.getActive();
  var sheet = ss.getSheetByName('TEST');
  var range = sheet.getRange(2, 1, 1000, 1);
  var values = range.getValues();

  var teamsArray = [];

  for (var i = 0; i < values.length; ++i) {
    teamsArray.push(values[i][0]);
  }

  var uniqueArray = [];

  uniqueArray.push(teamsArray[0]);

  for (var i in teamsArray) {
    if ((uniqueArray[uniqueArray.length - 1] != teamsArray[i]) && (teamsArray[i] !== "")) {
      uniqueArray.push(teamsArray[i]);
    }
  }
  return uniqueArray;
}

function savePositions(myProperty, positions) {
  PropertiesService.getScriptProperties().setProperty("myProperty", JSON.stringify(positions));
};

function getPositions() {
  var returnedObj = PropertiesService.getScriptProperties()
};

index.html 

  <body>



    <div id="myList" class="connectedSortable">MY LIST</div>

    <table id=table1>
      <div id="team1">
        <p>TEAM 1</p>
        <br>
        <div id="group" v>SELECTED</div>
        <ul id="team1s" name='team1s' class="connectedSortable"></ul>
        <div id="group">ALTERNATE</div>
        <ul id="team1a" name='team1a' class="connectedSortable"></ul>
      </div>
    </table>

    <table id=table2>
      <div id="team2">
        <p>TEAM 2</p>
        <br>
        <div id="group" v>SELECTED</div>
        <ul id="team2s" name='team2s' class="connectedSortable"></ul>
        <div id="group">ALTERNATE</div>
        <ul id="team2a" name='team2a' class="connectedSortable"></ul>
      </div>
    </table>

    <table id=table3>
      <div id="team3">
        <p>TEAM 3</p>
        <br>
        <div id="group" v>SELECTED</div>
        <ul id="team3s" name='team3s' class="connectedSortable"></ul>
        <div id="group">ALTERNATE</div>
        <ul id="team3a" name='team3a' class="connectedSortable"></ul>
      </div>
    </table>

    <table id=table4>
      <div id="team4">
        <p>TEAM 4</p>
        <br>
        <div id="group" v>SELECTED</div>
        <ul id="team4s" name='team4s' class="connectedSortable"></ul>
        <div id="group">ALTERNATE</div>
        <ul id="team4a" name='team4a' class="connectedSortable"></ul>
      </div>
    </table>

    <script>
      $(function() {
        google.script.run.withSuccessHandler(buildOptionsList)
          .getTeamArray();
      });


      function buildOptionsList(uniqueArray) {
        var div = document.getElementById('myList');
        for (var i = 0; i < uniqueArray.length; i++) {
          var ul = document.createElement('ul');
          var li = document.createElement('li');
          var cLass = li.setAttribute('class', 'ui-state-default');
          var iD = li.setAttribute('id', uniqueArray[i]);


          li.appendChild(document.createTextNode(uniqueArray[i]));
          div.appendChild(ul);
          div.appendChild(li);
        }
      }

      $(function() {
        $("#myList, #team1s, #team1a, #team2s, #team2a, #team2s, #team3s, #team3a, #team4s, #team4a").sortable({
          connectWith: ".connectedSortable",
          update: function(event, ui) {
            var changedList = this.id;
            var order = $(this).sortable('toArray');
            var positions = order.join(';');

            console.log({
              id: changedList,
              positions: positions

            });

            //Instead of using JSON to save, can I use the spreadsheet itself to save the positions and then pull it from there as I did with "buildOptionsList" above?

            function saveList() {
              google.script.run.savePositions("myProperty", JSON.stringify(positions));

              JSON.parse("myProperty");
            }
          }
        })
      });


      $(function getPositions(event, ui) {
        var changedList = this.id;
        var order = $(this).sortable('toArray');
        var positions = order.join(';');

        console.log({
          id: changedList,
          positions: positions
        });

      });

    </script>
  </body>

</html>

Ответы [ 2 ]

0 голосов
/ 21 февраля 2019

Также можно просто использовать браузер localStorage на стороне клиента. 

localStorage.setItem('id', positions); //Store positions in users browser
localStorage.getItem('id'); //Retrieve the stored positions later

Примечания:

  • Чтобы это работало,URL (document.domain из iframe = "*. googleusercontent.com"), из которого развернут ваш скрипт, должен оставаться постоянным.Во время моего краткого тестирования оно было постоянным даже при изменении с /dev на /exec родительского (script.google.com) и даже при обновлении версии.Но нет официальной ссылки.

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

0 голосов
/ 21 февраля 2019

Используя простой пример google.script.run: 

<script>
function sendStringToServer() {
  var string=$('#text1').val();
  google.script.run
  .withSuccessHandler(function(s){
    alert(s);
  })
  .saveString(string);
}
</script>

Google Script: 

function myFunction() {
  PropertiesService.getScriptProperties().setProperty('MyString', string);
  return "String was saved in Service";
}
...