简体   繁体   中英

How to automatically display a user email in an HTML form field using Google Apps Script and JavaScript

I've created an HTML form using Google HTML service. How do I automatically display the user's email in the email field when they open the form? I already have a function for onload for the date. I tried using google.script.run , but it's not working. Here is my HTML code:

<body onload="todaysDate()"> 
  <form>
    <label><span> Requestor:  </span><input id="reqEmail" type="text" name="reqEmail" placeholder="Your email..."></label>      
        <br>       
        <label><span>Requestor's department:  </span><input id="reqDept" type="text" name="reqDepartment" placeholder="Your deparment..."></label>
        <br>        
        <label><span>Date of Submission:  </span><input id="subDate" type="text" name="dateSubmission"></label>
        <br> 
        <label><span>Required delivery date:  </span><input id="delDate" type="date" name="dateDelivery"></label>
        <br>
   </form>
</body>  

Here is my Code.gs:

//Get user email
function getUserEmail() {
  var userEmail = Session.getActiveUser().getEmail();  
  Logger.log(userEmail);
}

Here is my JavaScript:

//Insert todays's date to "Date of Submission"
var d = new Date();
var curr_day = d.getDate();
var curr_month = d.getMonth() +1;
var curr_year = d.getFullYear();

function todaysDate() {
document.getElementById('subDate').value=(curr_month + "-" + curr_day + "-" + curr_year);

};

google.script.run.getUserEmail(userEmail);
var email = document.getElementById('reqEmail'); 
email.value = userEmail;

I guess, you read this but still worth mentioning.

How does google.script.run work? It just runs a function on "server" side. This server side function can return some result (which was suggested by Darren in the previous answer) but you'd still need to tell your script what to do with this result afterwards.

And if you want to do something with the result on client side, you'll need to use .withSuccessHanlder part — with its help you specify your client side function which will accept the result of the server function's work. In your case — this result is the user email. So it'll be something like google.script.run.withSuccessHandler(todaysDate).getUserEmail() — you aren't passing any parameters to getUserEmail() because it doesn't need them.

But you need to change your todaysDate() function a bit.

function todaysDate(userEmail) {
  document.getElementById('subDate').value = (curr_month + "-" + curr_day + "-" + curr_year);
  document.getElementById('reqEmail').value = userEmail; 
};

And instead of assigning an onload function to the <body> tag you can just add this line into your <script> google.script.run.withSuccessHandler(todaysDate).getUserEmail(); .

As a whole, it'll look something like this:

<script>

//Insert todays's date to "Date of Submission"
var d = new Date();
var curr_day = d.getDate();
var curr_month = d.getMonth() +1;
var curr_year = d.getFullYear();
google.script.run.withSuccessHandler(todaysDate).getUserEmail();
function todaysDate(userEmail) {
  document.getElementById('subDate').value = (curr_month + "-" + curr_day + "-" + curr_year);
  document.getElementById('reqEmail').value = userEmail; 
};

</script>

I'm not really familiar with the Google HTML Service but if it works like regular javascript then you should be able to:

- Update the 'getUserEmail' function to return the email address:

//Get user email
function getUserEmail() {
    var userEmail = Session.getActiveUser().getEmail();
    Logger.log(userEmail);
    return userEmail;
}

- Update your javascript to receive the email address:

var userEmail = getUserEmail();
var email = document.getElementById('reqEmail');
email.value = userEmail;

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM