google-apps-script - 错误类型错误：无法读取未定义 userClicked @ funcs.gs:8 的属性“fn”

问题描述

我使用连接到电子表格的谷歌脚本制作了一个网络应用程序。

一切都运行良好，直到我尝试在用户提交表单信息时添加发送电子邮件通知的功能

查看用户单击功能的运行日志时的错误代码 - TypeError: Cannot read property 'fn' of undefined userClicked @funcs.gs:8

function-js 页面如下

  'function userClicked(userInfo) {
  var ss = SpreadsheetApp.openByUrl(url1);
  var ws = ss.getSheetByName("SNAGS");
  ws.appendRow([userInfo.fn, 
                userInfo.contact,
                userInfo.email,
                userInfo.house,
                userInfo.snag, 
                userInfo.query,
                new Date()]);

 <script>

  document.addEventListener('DOMContentLoaded', function()
                              {

                                 document.getElementById("btn").addEventListener("click",doStuff);
                                 document.getElementById("house").addEventListener("input",getInfo);

                                 var selectBoxes = document.querySelectorAll('select');
                                  M.FormSelect.init(selectBoxes);
                      
                                  google.script.run.withSuccessHandler(populateHouse).getHouse();

                              }
                           ); 



        function populateHouse(hous)
                              {
                                 var autocomplete = document.getElementById('house');
                                 var instances = M.Autocomplete.init(autocomplete, { data: hous });
                              }
  

        function doStuff()                        
                          
                         {
                           var isValid = document.getElementById("fn").checkValidity();

                           if(!isValid)
                                       {
                                         M.toast({html: 'Name Required!'});
                                       }
                              else
                                       {
                                          addRecord();
                                        }
                         }

      
      function addRecord ()
                          {
                              var userInfo = {};
     
                                      userInfo.fn = document.getElementById("fn").value;
                                      userInfo.contact = document.getElementById("contact").value;
                                      userInfo.email = document.getElementById("email").value;
                                      userInfo.house = document.getElementById("house").value;
                                      userInfo.snag = document.getElementById("snag").value;
                                      userInfo.query = document.getElementById("query").value;


                                    google.script.run.userClicked(userInfo);
       
                                    document.getElementById("fn").value ="";
                                    document.getElementById("contact").value ="";
                     document.getElementById("email").value ="";
                                    document.getElementById("house").value ="";
                                    document.getElementById("snag").value ="";
                                    document.getElementById("query").value ="";

                                    M.updateTextFields();


                                  var myApp = document.getElementById("snag");
                                   myApp.selectedIindex = 0;
                                  M.FormSelect.init(myApp);

                          }

       function getInfo ()
                          {

                             var HouseInfo = document.getElementById("house").value;
                            
                             if(HouseInfo.length === 3)
                                {
                                  google.script.run.withSucceshandler(updateInfo).getData(HouseInfo);

                                }
                          }


      function updateInfo (infos)
                            {
                              document.getElementById("info").value = infos;
                              M.updateTextFields();
                           }
                          

 </script>

<!DOCTYPE html>
<html>
  <head>
    <base target="_self">

         <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
          <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
          <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">

    <?!= include("page-css"); ?>  
  </head>
  
  <body>

      <div class="container">

               <h3>TPM Maintance |Ticketing System</h3>
               <br>

           <div class="row">
     
                     <div class="input-field col s4">
                       <input placeholder="Your Full Names" id="fn" type="text" class="validate" required >
                       <label for="fn">Your Name:</label>
                     </div>

                     <div class="input-field col s4">
                        <input id="contact" type="text" class="validate">
                        <label for="contact"> Your Phone number:</label>
                     </div>  


                      <div class="input-field col s4">
                        <input id="email" type="email" class="validate" required>
                        <label for="email">Email:</label>
                     </div>       
               
          </div>
            
      
            
            
      <div class="row">
                    
                   

                     <div class="input-field col s4">
                        <i class="material-icons prefix">home</i>
                        <input type="text" id="house" class="autocomplete" required>
                        <label for="house">Location Area/ House Unit# </label>
                     </div>

                       <div class="input-field col s4">
                      <select id="snag" required>
                        <option disabled selected> Snag Category</option>
                            <?!= list; ?>
                      </select>
                      <label>Snag Type</label>
                     </div>   

                      <div class="input-field col s4">
                        <input disabled id="info" type="text" class="validate">
                        <label for="info">Unit_Info</label>
                     </div>

                       
              </div>
           


              <div class="row">          
              
                          <div class="input-field col s12">
                             <textarea id="query" class="materialize-textarea"></textarea>
                             <label for="query">Query Desc:</label>
                          </div> 

              </div>
       
                    
          <div class="row">
   
             <button id="btn" class="btn waves-effect waves-light deep-orange darken-2" type="submit" name="action">Send Ticket!
             <i class="material-icons right">send</i>
             </button>
             
          </div>
           
      
    </div>

     <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script> 
            
    <?!= include("page-js"); ?>
  </body>



</html>
//html part

请从我的工作中查看更多代码谢谢。请原谅我是新手

标签： google-apps-scriptspreadsheet

google-apps-script - 错误类型错误：无法读取未定义 userClicked @ funcs.gs:8 的属性“fn”

问题描述

解决方案

推荐阅读