Specifying HTML/Javascript forms in Google App Script

Question

I have two HTML forms. Both perform similar tasks, you fill them in and they send emails.

Upon clicking the submit button after filling in the form, I call a Google App Script to build the email and send it. My issue is that both submit buttons are now sending the same email, despite my setups being isolated from each other.

I guess the issue is how do I tell G.A.S which form to specify? It's my first time doing any of this, and I'm stumped now.

Here is the end of Form A html:

And my Form A app script is:

// listen for an object sent from the HTML form
function projectRequest(formObj) {

The name of Form A in its html is:

So I think my issue is because Form B is similar and I'm calling formObj? Form B was my original tool and it works fine when filled in, but pressing the same submit button on Form A tries to run Form B's app script email code.

End of Form B html:

The Form B app script is:

function sendEmail(formObj) {

The name of Form B in html is:

Can someone offer advice, I'm truly stuck and hoping it's something minor.

Thank you.

EDIT: Form A HTML





title stuff
Fill in this form and press 'Submit' to etc etc

and Form A app script:

// listen for an object sent from the HTML form
function projectRequest(formObj) {

  // Extract the user name submitted etc
  //  The 'name' *parameter* from the HTML is the object we want to grab and insert here
  //
  var to = "EXAMPLE@EMAIL.com";
  var subject = "Project setup - ";
  var body = formObj.message; //main html body message

  // This style will preserve the line breaks from the users message in the tool 'textarea' and pass them to the sent email.
  var bodyformatParagraphPreserve = ' ';
  //
  // ------------------------------ ORIGINAL SEND EMAIL CODE ----------------------------
  // Send the email
  MailApp.sendEmail({
    to: to,
    subject: subject,
    htmlBody: body,
  })
  var output = HtmlService.createHtmlOutput('');
  SpreadsheetApp.getUi().showModalDialog(output, 'Closing request tool...');
}

Form B HTML:




Help Tool






Contact the Render Support team

Form B app script

function HomePageFurtherHelp(){ 
  var ui = SpreadsheetApp.getUi();
  //
  //Call the HTML file and set the width and height
  var html = HtmlService.createHtmlOutputFromFile("Home Page - Further Help")
    .setWidth(1200)
    .setHeight(1400);
  //Display the dialog
  var dialog = ui.showModalDialog(html, " ");
} 

// listen for an object sent from the HTML form
function sendEmail(formObj) {

  // Extract the user name submitted etc
  //  The 'name' *parameter* from the HTML is the object we want to grab and insert here
  //
  var to = "EXAMPLE@EMAIL.com";
  var subject = "banana";
  var body = formObj.message; //main html body message

  // This style will preserve the line breaks from the users message in the tool 'textarea' and pass them to the sent email.
  var bodyformatParagraphPreserve = ' ';
  //
  // ------------------------------ ORIGINAL SEND EMAIL CODE ----------------------------
  // Send the email
  MailApp.sendEmail({
    to: to,
    subject: subject,
    htmlBody: body + "",
  })
  var output = HtmlService.createHtmlOutput('');
  SpreadsheetApp.getUi().showModalDialog(output, 'Closing help tool...');
}

Cooper · Accepted Answer

I used a hidden element to tell them apart.

ah1.html:

code.gs:

function launchSideBar() {
  SpreadsheetApp.getUi().showSidebar(HtmlService.createHtmlOutputFromFile("ah1"));
}

function processForm(obj) {
  console.log(obj);
  const ss=SpreadsheetApp.getActive();
  const sh=ss.getSheetByName('email');
  sh.appendRow([obj.email,obj.subject,obj.message]);
  return {number:obj.number,msg:"Email Sent"}
}

Specifying HTML/Javascript forms in Google App Script

Answers (1)

Related Questions