CODEWITHSUNDEEP
google-apps-scriptgoogle-sheets
axis9011
axis9011

Reputation: 33

Custom dialog box isn't showing any output

I'm using the following scripts for a custom dialog box to make data entries into a specific range of cells. (source: https://spreadsheet.dev/custom-dialog-in-google-sheets)

Here is the HTML part:

<!DOCTYPE html>
<html>
<head>
  <base target="_top">
  <script>
    function submitForm() {
      google.script.run.appendRowFromFormSubmit(document.getElementById("Stunde eintragen"));
      document.getElementById("form").style.display = "none";
      document.getElementById("Danke").style.display = "block";
    }
  </script>
</head>
<body>
  <div>
  <div id="form">
  
  <form id="Stunde eintragen">
    <label for="Datum">Datum</label>
    <input type="date" id="Datum" name="Datum"><br><br>
    <label for="Inhalt">Inhalt</label>
    <input type="text" id="Inhalt" name="Inhalt" size="60"><br><br>
    <label for="Lehrkraft">Lehrkraft</label>
       <select id="Lehrkraft" name="Lehrkraft">
          <option value="Alexander Michaelis">Alexander Michaelis</option>
          <option value="Thomas Weider">Thomas Weider</option>       
       </select>
     
    <div>
       </br>
      <label for="Ausfall">Stunde ausgefallen?</label><br>
      <input type="radio" id="E" name="Ausfall" value="E">
      <label for="E">Entschuldigt</label><br>
      <input type="radio" id="UE" name="Ausfall" value="UE">
      <label for="UE">Unentschuldigt</label><br><br>
      <input type="button" value="Eintragen" onclick="submitForm();">
  </form>
  </div>
  </div>
  <div id="Danke" style="display: none;">
    <p>Die Stunde wurde eingetragen!</p>
  </div>
</body>
</html>

And here is the GAS part:


//@OnlyCurrentDoc

function onOpen() {
  SpreadsheetApp
    .getUi()
    .createMenu("Klassenbuch")
    .addItem("Stunde eintragen", "showFeedbackDialog")
    .addToUi();
}

function showFeedbackDialog() {
  var widget = HtmlService.createHtmlOutputFromFile("Form.html");
  SpreadsheetApp.getUi().showModalDialog(widget, "Stunde eintragen");
}

function appendRowFromFormSubmit(form) {
  var row = [form.name, form.feedback, form.rating];
  SpreadsheetApp.getActiveSheet().appendRow(row);
}

By submitting the form I want to have the data copied into a specific range (for example A7:A, B7:B, C7:C, D7:D with row 6 for the labels) and everytime I use the script it should jump in the next row.

But unfortunately the script doesn't show any output.

Can anybody help?

Upvotes: 0

Views: 167

Answers (1)

Mike Steelson
Mike Steelson

Reputation: 15328

You can't transmit objects, but you can transmit values, even if they are in array like this

html :

function submitForm() {
  var form = document.getElementById("Stunde eintragen")
  google.script.run.appendRowFromFormSubmit([form.Datum.value , form.Ausfall.value , form.Inhalt.value]);
  document.getElementById("form").style.display = "none";
  document.getElementById("Danke").style.display = "block";
}

and gs

function appendRowFromFormSubmit(data) {
  SpreadsheetApp.getActiveSheet().appendRow(data);
}

Note that in your form has no feedback and no rating !!

Upvotes: 1

Related Questions