I'm trying to create a button that, upon clicking, "saves" the positions of multiple lists from a connected-sortable. I want the script to be able to retain the most recent position of each list item when the page is refreshed (i.e. If list 1 starts as A,B,C and I change it to B,A,C and refresh the page, it stays as B,A,C.).
I'm attempting to accomplish this by creating an array from an html document (published as a web app), save it using the getUserProperities
function, and then return it the next time I open the web app.
I am able to log the positions without issue, but I'm having trouble figuring out where to run the getUserProperities
function, or what other issue I may be dealing with.
In the console from the web app, I get this error Uncaught TypeError: Cannot read property 'getUserProperties' of undefined at saveList (userCodeAppPanel:4) at HTMLButtonElement.onclick (userCodeAppPanel:1)
.
Where should I be calling the getUserProperties
function? From code.gs
or index.html
? I have been working off the example provided HERE.
The relevant portions of my code, from index.html
are below.
<script>
$( function() {
$( "#myList, #flight1a, #flight1b, #flight2a, #flight2b, #flight3a, #flight3b, #sortable2" ).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
});
}
})
});
</script>
<script>
function saveList() {
google.script.run.PropertiesService.getUserProperties().setProperty('myProperty', JSON.stringify(positions));
var returnedObj = PropertiesService.getUserProperties("myProperty");
returnedObj = JSON.parse(returnedObj);
}
</script>
</head>
<body>
<button onclick="saveList()">Click me</button>
google.script.run
could be used to call a server side function not to call directly the Properties Service.For further details see https://developers.google.com/apps-script/guides/html/reference/run
Properties Service can only be accessed through Google Apps Script, so it must be called in one of your
*.gs
files. To execute a server-side function, you need to usegoogle.script.run
(there's also a guide available).For example, in your
code.gs
file add this function:Then, in your
index.html
file modifysaveList()
to: