I’m having trouble returning data from `.onSelect` function in a `UITableRow`

Scriptable
1

I have an array of strings.

I’d like to transfer some of those strings to another array interactively with a UITable.

Here is a mock up of what I’ve written so far:

let originalArray = ["one","two","three","four"];
let newArray = [];

function makeThisTable() {
  for (i in originalArray) {
    let thisRow = new UITableRow();
    thisRow.dismissOnSelect = false;
    thisRow.addText(originalArray[i]);
    thisTable.addRow(thisRow);
    thisRow.onSelect = (number) => {
      thisTable.removeRow(thisRow);
      originalArray.splice(number, 1);
      thisTable.reload();
      };
    };
  };

let thisTable = new UITable();
thisTable.showSeparators = true;
makeThisTable();
thisTable.present();

This makes a table with my originalArray and as I tap any of the rows,
newArray is populated. If I log the arrays from within the arrow notated
function, they output with their newly changed values.

If I log from outside the makeThisTable() function, the
arrays remain unchanged, presumably due to the altered arrays being
local to the arrow-notated function?

Simple question: how can I return the altered arrays (or even just newArray
as it’s more important to me) from the function so I can use it in the rest of
my script?

I’ve read about returning from arrow notated functions on MDN and w3c but
can’t quite get my head around it. The fact that that the function is called
from .onSelect is messing with my tiny, JavaScript inexperienced brain!

Thanks for any help.

2

If I understand correctly what you are attempting to do, here’s one way you could do it. I’ve added a comment above evey line I’ve added or amended.

let originalArray = ["one", "two", "three", "four"];
let newArray = [];

//Added a parameter to pass in a reference to the new array
function makeThisTable(p_someArray)
{
	for (i in originalArray)
	{
		let thisRow = new UITableRow();
		thisRow.dismissOnSelect = false;
		thisRow.addText(originalArray[i]);
		thisTable.addRow(thisRow);
		thisRow.onSelect = (number) =>
		{
			thisTable.removeRow(thisRow);
			//Added an action to actually put the removed row into the referenced array
			p_someArray.push(originalArray[number]);
			originalArray.splice(number, 1);
			thisTable.reload();
		};
	};

};

let thisTable = new UITable();
thisTable.showSeparators = true;
//Passed in the newArray variable as the new parameter for the function
makeThisTable(newArray);
//Added an await to wait on the table being finished with before we check the array
await thisTable.present();
//Added a logging line to show the contents of newArray
console.log("newArray contents are : " + newArray);

Hope that’s something close to what you were after.

2 Likes
3

Wow, thank you!

I’m embarrassed as I had got as far as inserting an Array.push() line in my actual script but
forgot to include it in my question above! How stupid of me!

But it seems it was as simple as passing the function a parameter. I’m still very new to programming
and some concepts like that (simple as they may be!) can be hard to get my head around.

This solution is exactly what I was looking for. Oh, and another thank you as this is only my
second post on this forum and you’ve replied to both of them really helpfully.