Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
402 views
in Technique[技术] by (71.8m points)

javascript - Function not executing in google script HTML service

I am coding a tool for myself and my classmates that will create a google doc and email it to the selected teacher, using all fields that are filled in and filling all those that are not with the defaults for the selected subject, say language arts, but the function that takes the selected information and uses it to send the email is not executing. I've checked the executions for the project, and the function, customDoc(), has not once been executed. I suspect it's a problem with my HTML, as I have not seen any error messages when I tested the function in the editor to see if there were any syntax errors, but it was spot clean, just never executed. Here's my code, and while the error is likely in the HTMl I will provide my JS too.

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index.html');
}

function showDialoge() {
  SpreadsheetApp.getUi().showModelessDialog(HtmlService.createHtmlOutputFromFile('Index.html'), 'Test');
}

function customDoc(clicked_id) {
  var d = new Date();
  var s = (d.getDate()) + '/' + (d.getMonth() + 1) + '/' + d.getFullYear();
  console.log(s);
  var cycler = clicked_id
  var math = ['[email protected]', 'math for ']
  var LA = ['[email protected]', 'la for ']
  var science = ['[email protected]', 'science for ']
  var is = ['[email protected]', 'I&S for ']
  var span = ['[email protected]', 'Espanol para ']
  var presets = [math, LA, science, is, span]
  var email1 = document.getElementById('Email')
  var subject1 = document.getElementById('Sub')
  var docName1 = document.getElementById('docName')
  var message1 = document.getElementById('message')
  var email = null
  if (email1 != ' ') {
    email = email1
  } else {
    email = presets[cycler];
    [1];
  }
  var subject = null
  if (subject1 != ' ') {
    subject = subject1
  } else {
    subject = presets[cycler];
    [2]; + s
  }
  var doc = null
  if (docName1 != ' ') {
    doc = docName1
  } else {
    doc = presets[cycler];
    [2]; + s
  }
  var document = documentApp.create(doc)
  var url = document.getUrl();
  var message = null
  if (message1 != ' ') {
    message = message1 + '' + url
  } else {
    message = url
  }

  GmailApp.sendEmail(email, subject, message);
}
<!DOCTYPE html>
<script src="Code.gs"></script>
<html>
<h1>CREATE DOC</h1>

<body>


</body>
<p>Email</p>
<input type='text' id='Email' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p style=" font-family: Times New Roman, Times, serif;">Doc name</p>
<input type='text' id='docName' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p>Subject</p>
<input type='text' id='Sub' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p>message</p>
<input type='text' id='message' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">

<h2>Fill blanks for subject: </h2>


<button id='2' onclick=c ustomDoc(this.id)> LA </button>
<button id='3' onclick=c ustomDoc(this.id)> Science </button>
<button id='4' onclick=c ustomDoc(this.id)> Individuals and societies </button>
<button id='5' onclick=c ustomDoc(this.id)> Spanish  </button>
<button id='1' onclick=c ustomDoc(this.id)> math </button>


</html>
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

In short, customDoc() is a server function and you need to use google.script.run to tell Apps Script to run a specific server function. So instead of calling onclick="customDoc(this.id)", try onclick="google.script.run.customDoc(this.id)". Don't include Code.gs in your HTML file as that's server-side code and it won't work. I highly recommend reading the Client-to-Server Communication guide.

Your customDoc() function is another story :) Below is a very simple way to reorganize your different presets (e.g. subjects) using objects. I also replaced your date formatting code with Utilities.formatDate(), which may be a little easier to comprehend.

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index.html');
}

function customDoc(subject) {
  var subjects = {
    'math': {
      email: '[email protected]',
      preSubject: 'math for '
    },
    'la': {
      email: '[email protected]',
      preSubject: 'la for '
    },
    'science': {
      email: '[email protected]',
      preSubject: 'science for '
    },
    'is': {
      email: '[email protected]',
      preSubject: 'I&S for '
    },
    'spanish': {
      email: '[email protected]',
      preSubject: 'Espa?ol para '
    }
  };

  var formattedDate = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), 'M/d/yyyy');
  
  console.log('Today: ' + formattedDate);
  console.log('Subject: ' + subject);
  console.log(subjects[subject]);
}
<!DOCTYPE html>
<html>
  <body>
    <h1>CREATE DOC</h1>
    <p>Email</p>
    <input type="text" id="Email" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p style="font-family: Times New Roman, Times, serif">Doc name</p>
    <input type="text"  id="docName" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p>Subject</p>
    <input type="text" id="Sub" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p>message</p>
    <input type="text" id="message" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />

    <h2>Fill blanks for subject:</h2>

    <button id="la" onclick="google.script.run.customDoc(this.id)">LA</button>
    <button id="science" onclick="google.script.run.customDoc(this.id)">Science</button>
    <button id="is" onclick="google.script.run.customDoc(this.id)">Individuals and societies</button>
    <button id="spanish" onclick="google.script.run.customDoc(this.id)">Spanish</button>
    <button id="math" onclick="google.script.run.customDoc(this.id)">math</button>
  </body>
</html>

Try running the above and clicking the science button. You should get an execution log like:

Today: 10/30/2020
Subject: science
{preSubject=science for , [email protected]}

Now that customDoc() is actually executing, you can start trying to fix the Google Doc generation. It seems to me that you're creating a completely blank Google Doc, which probably isn't what you want. I think you need to work on it some more and then come back if you have more specific questions about generating the document. Good luck!


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...