Невозможно обновить электронную таблицу Google из данных, введенных на боковой панели. - PullRequest
Новая
       0

Невозможно обновить электронную таблицу Google из данных, введенных на боковой панели.

0 голосов
/ 30 января 2020

Я создал боковую панель с помощью скрипта Google HTML, и когда я пытаюсь добавить данные, введенные на боковой панели, в активную таблицу Google, и мне не удается отследить, где код не может добавить введенные данные. Я прилагаю свой код HTML и код GS. Просьба сообщить мне, где мой код не работает. Также я хотел бы создать раскрывающийся список для поля зависимостей, который должен принимать данные из электронной таблицы, я понятия не имею, может ли кто-нибудь помочь с литературой. Заранее спасибо 

function SideBar() {

  var template=HtmlService.createTemplateFromFile('SideBar')
  var html= template.evaluate();
  html.setTitle("New Task");
  var ui=SpreadsheetApp.getUi();
  ui.createMenu("Task Manager")
  .addItem("Add New Task","SideBar")
  .addToUi();
  //.addItem("Update Task","SideBar")
  //.addToUi();
  //.addItem("Re-assign Task", "SideBar")
  //.addToUi();
  ui.showSidebar(html);
  }

function appendData(data){

  //var url= '1S64cYsfHEcddmOfXNfAO6VaCQ9LIFPylx8Sj_6h70e4';
  var ws = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Task");
  var log= ws.appendRow([data.Task,
                data.TaskDescription,
                data.AssignedTo,
                data.StartDate,
                data.EndDate,
                data.PriorityType,
                data.Dependency]);
  Logger.log(log);

}

/ * HTML Код файла ниже * / 

<!DOCTYPE html>
  <html>
    <head>
      <!--Import Google Icon Font-->
      <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">


      <!--Let browser know website is optimized for mobile-->
      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    </head>

    <body>
        <div class="container">

        <div class="row">

        <div class="input-field col s12">
          <i class="material-icons prefix">assignment</i>
          <input id="Task" type="text" class="validate">
          <label for="Task">Task</label>
        </div>

        <div class="input-field col s12">
          <i class="material-icons prefix">description</i>
          <input id="TaskDescription" type="text" class="validate">
          <label for="TaskDescription">Task Description</label>
        </div>

        <div class="input-field col s12">
          <i class="material-icons prefix">assignment_ind</i>
          <input id="AssignedTo" type="email" class="validate">
          <label for="AssignedTo">Assigned To </label>

          <!--div class="dropdown-content">
                 <a href="https://www.google.com">Google</a>
                 <a href="https://www.facebook.com">Facebook</a>
                 <a href="https://www.youtube.com">YouTube</a>
            </div-->            
        </div>

     <div class="input-field col s6">
          <!--i class="material-icons prefix">date_range</i-->
          <input id="StartDate" type="date" class="validate">
          <label for="StartDate">Start Date</label>  
        </div>

        <div class="input-field col s6">
          <!--i class="material-icons prefix">date_range</i-->
          <input id="EndDate" type="date" class="validate">
          <label for="EndDate">End Date </label>
          </div>

        <div class="input-field col s12">
          <!--i class="material-icons prefix">date_range</i-->
          <input id="PriorityType" type="text" class="validate">
          <label for="PriorityType">Priority Type </label>        
        </div>

        <div class="input-field col s12">
          <!--i class="material-icons prefix">date_range</i-->
          <input id="Dependency" type="text" class="validate">
          <label for="Dependency">Dependency </label>         
        </div>

        <div class="input-field col s12">
         <button class="btn waves-effect waves-light">Assign
           <input id="btn">
           <i class="material-icons right">send</i>
        </button>
       </div> 


      </div>   
      </div>

      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

      <script>

      var Task = document.getElementById("Task");
      var TaskDescription = document.getElementById("TaskDescription");
      var AssignedTo = document.getElementById("AssignedTo");
      var StartDate = document.getElementById("StartDate");
      var EndDate = document.getElementById("EndDate");
      var PriorityType = document.getElementById("PriorityType");
      var Dependency = document.getElementById("Dependency");-->

      document.getElementbyId("btn").addEventListener("click",addRecord);

      function addRecord(data){
           var data= {
           Task:Task.value,
           TaskDescription:TaskDescription.value,
           AssignedTo:AssignedTo.value,
           StartDate:StartDate.value,
           EndDate:EndDate.value,
           PriorityType:PriorityType.value,
           Dependency:Dependency.value
           };
           google.script.run.appendData(data);
      }

      </script>
    </body>
  </html>

Ответы [ 2 ]

0 голосов
/ 02 февраля 2020

Спасибо, Купер. Ваш скрипт помог мне, и, наконец, он работает, когда я меняю кнопку ввода вне div и предоставляю функцию запуска Onclick напрямую. Тем не менее я не уверен, почему команда Event Listener не работает. Коды следующие: G-код: 

   function onOpen() {
      var userInterface=HtmlService.createHtmlOutputFromFile('SideBarBackUp');
      userInterface.setTitle('New Task');
      var ui=SpreadsheetApp.getUi();
      ui.showSidebar(userInterface);
      ui.createMenu("Task Manager")
      .addItem("Add New Task","SideBar")
      .addToUi();
      }

    function appendData1(data){
      Logger.log(data);
      SpreadsheetApp.getActive().getSheetByName("Task").appendRow([data.txt,data.dxt,data.axt,data.sxt,data.ext,data.pxt,data.yxt]);
    }

HTML Код: 

<!DOCTYPE html>
  <html>
    <head>
      <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">
      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    </head>

    <body>
<div class="container">

<div class="row">
        <div class="input-field col s12">
          <i class="material-icons prefix">assignment</i>
          <input id="Task" type="text" class="validate">
          <label for="Task">Task</label>
        </div>         

        <div class="input-field col s12">
          <i class="material-icons prefix">description</i>
          <input id="TaskDescription" type="text" class="validate">
          <label for="TaskDescription">Task Description</label>
        </div>

        <div class="input-field col s12">
          <i class="material-icons prefix">assignment_ind</i>
          <input id="AssignedTo" type="email" class="validate">
          <label for="AssignedTo">Assigned To </label>         
        </div>

        <div class="input-field col s6">
          <input id="StartDate" type="date" class="validate">
          <label for="StartDate">Start Date</label>  
        </div>

        <div class="input-field col s6">   
          <input id="EndDate" type="date" class="validate">
          <label for="EndDate">End Date</label>
        </div>

        <div class="input-field col s12">
          <input id="PriorityType" type="text" class="validate">
          <label for="PriorityType">Priority Type </label>        
        </div>

        <div class="input-field col s12">
          <input id="Dependency" type="text" class="validate">
          <label for="Dependency">Dependency </label>         
        </div>
</div>
</div>       
       <input id=btn type="button" class="btn waves-effect waves-light" value="Assign" onClick="addRecord();" />

      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

      <script>

     // document.getElementbyId('btn').addEventListener('click', addRecord();)

     function addRecord(data){
          var t= document.getElementById('Task').value;
          var d= document.getElementById('TaskDescription').value;
          var a= document.getElementById('AssignedTo').value;
          var s= document.getElementById('StartDate').value;
          var e= document.getElementById('EndDate').value;
          var p= document.getElementById('PriorityType').value;
          var y= document.getElementById('Dependency').value;
          var data={txt:t,dxt:d,axt:a,sxt:s,ext:e,pxt:p,yxt:y};
          console.log(data);
        google.script.run.appendData1(data);
         }
      console.log('My Code')


      </script>
    </body>
  </html>

Еще раз спасибо за терпение и как за новость ie за кодирование я бы конечно, больше работаю над моими навыками кодирования.

0 голосов
/ 30 января 2020

Я сильно упростил ваш код. В нем было несколько ошибок на стороне клиента. Я рекомендую вам больше времени уделять изучению использования инструментов разработчика ваших браузеров. Особенно console.log.

Вы, вероятно, захотите вернуть часть своего стиля назад, я бы сделал это медленно, чтобы вы больше не потерялись.

В любом случае, теперь это работает с аналогичной функцией addRecord.

Google Script: 

function ShowDialog() {
  var userInterface=HtmlService.createHtmlOutputFromFile('aq7');
  var ui=SpreadsheetApp.getUi();
  ui.showSidebar(userInterface);
  }

function appendData(data){
  Logger.log(data);
  SpreadsheetApp.getActive().getSheetByName("Task").appendRow([data.text]);
}

html: 

<!DOCTYPE html>
  <html>
    <body>
    <input type="text" id="txt" />
    <input type="button" value="Assign" onClick="addRecord();" />
      <script>
      function addRecord(){
        var t=document.getElementById('txt').value;
        var data={text:t};
        console.log(data);
        google.script.run.appendData(data);
      }
      console.log('My Code')
      </script>
    </body>
  </html>

Для поиска этой ошибки потребовалось некоторое время. Вы видите, где это?

document.getElementbyId("btn").addEventListener("click",addRecord);

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...