I have a table I've created to pop up in my Google Sheet file via HTML Service UI that has a radio button listed before each row in the table. I am looking to get the value of the selected radio button chosen by the user, and turn into a variable for a separate server side apps script I am looking to execute 'onClick' in of the chosen radio button. I am having difficulty, though, pulling back the value of the selected radio button with the current iteration of my code (shown below). Let me know what I am missing. Is it possible to avoid a for loop to get at the selected value?
function htmlOrders() {
var active = SpreadsheetApp.getActive();
var sheet = active.getSheetByName("POHistory");
var lastRow = sheet.getLastRow();
var myRange = sheet.getRange("A2:K" + lastRow);
var data = myRange.getDisplayValues();
var optionsHTML = "";
var seenType = {};
for (var i = 0; i < data.length; i++) {
if(seenType[data[i][0]]) {
continue;}
seenType[data[i][0]] = true;
optionsHTML += "<tr>";
optionsHTML += "<td><input type='radio' name='selectedPO' value='" + data[i][0] + "' onclick='google.apps.script.run.editPO()';></td>";
optionsHTML += "</tr>"
}
return optionsHTML;}
function editPO(){
var x = document.table.selectedPO.value;
var html = HtmlService.createTemplateFromFile('editPO').evaluate();
html.setHeight(600).setWidth(800);
SpreadsheetApp.getUi()
.showModalDialog(html, 'Edit PO' + x);
}
HTML:
<!DOCTYPE html>
<html>
<head>
<style>
</head>
<body>
<form name="table" id="table">
<table>
<tr>
<th>Edit?</th>
<th>PO No.</th>
</tr>
<?!= htmlOrders(); ?>
</table>
</form>
</body>
</html>