Trouble Passing Object back to html in Google Apps Script - google-apps-script

Question

I have the code side creating an array and am now trying to pass it back to the HTML Service. I am stringifiying the object and when I run the logger I see that it's sending the correct information over. However, when it get's back to the html side I'm just seeing "undefined" or empty arrays no matter what I try. Any help would be appreciated, code is below:
Here it the html side.
function editFunction(){
//I start by passing an object over to the code side, based on user input
var userChoice = document.getElementById("userChoice").value;
google.script.run
.editJob(userChoice);
//Code side gathers some information based on user input formats into arrays
//and sends back...theoretically
<?var editData = editJob();?>
var returnedValues =JSON.parse(<?=editData?>);//object parsed
var arrayOfValues = [];
for (var n in returnedValues) {
var thisValue = returnedValues[n];
arrayOfValues.push(thisValue);//object reformatted as an array
}
document.getElementById("instructions").value = arrayOfValues[1];
//desired out put part of the array`
}
This is the code side:
function editJob(userChoice){
var ss = SpreadsheetApp.openById('1emoXWjdvVmudPVb-ZvFbvnP-np_hPExvQdY-2tOcgi').getSheetByName("Sheet1");
var jobReference = [];
var job;
//uses user input to gather necessary information and puts into arrays
for (var i = 1; job!=""; i++){
job = ss.getRange(i,27).getValue();
jobReference.push(job);
};
for(var n=1; n<jobReference.length;n++){
if(jobReference[n]==userChoice){
break;
}
};
var returnEdit = [];
for (var int =1; int<28;int++){//update int< for number of column
var value = ss.getRange(n+1,int).getValue();
returnEdit.push(value);
};//final array now formed
var returnStringified = JSON.stringify(returnEdit);
Logger.log(returnStringified);
return returnStringified //stringified results theoretically sent over
}

Answer 1

While I think your question has already been answered, I just wanted to point out that server side function can NOT send any data by itself.
Client side code has to call the server side function which can return a bunch of values clubbed together as one parameter. If client should have more data, then it is up to the client side code to call another server side function and get the required data.
In short server side will answer only what client side asks for. Server side code on its own can NOT send any data unsolicited.

Answer 2

Your function will end after google.script.run.editJob(userChoice);
You need a second function to run on success and preferably one to run on error as well. The function names for the sample below are successFunction() and errorFunction():
google.script.run.withSuccessHandler(successFunction).withFailureHandler(errorFunction).serverSideFunc();
serverSideFunction() is the name of the function to run on the server side.
Create a new function to run on success and pass the data back to the function. Roughly, wothout debugging but to give a basic idea, it becomes:
function editFunction(){
//I start by passing an object over to the code side, based on user input
var userChoice = document.getElementById("userChoice").value;
google.script.run
.editJob(userChoice);
.withSuccessHandler(
}
function handleTheData(returnedValues) {
var arrayOfValues = [];
for (var n in returnedValues) {
var thisValue = returnedValues[n];
arrayOfValues.push(thisValue);//object reformatted as an array
}
document.getElementById("instructions").value = arrayOfValues[1];
//desired out put part of the array`
}
See the documentation for google.script.run.