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

Как добавить персонализированный ввод в указанную строку и столбец в листах Google, используя скрипт Google?

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

Я новичок в скрипте javascript / google apps, и мне нужна помощь. Извлечение листов Google

Я бы хотел, чтобы пользователь мог вводить тип piece (например, 0511) и количество значений по умолчанию (например, 2), после чего оно будет автоматически заполнено в правой ячейке правой строки (строка записанного типа) и правой колонке (активный столбец)

Вот что я уже написал (это позволяет мне заполнить 4 первых ряда активной ячейки):

Это в форме. html: 

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
  </head>
  <body>
    <form id="myform">

    <div class="block form-group">
    <label for="date">Date</label>
    <input type='date' name='date' id="date" required="required"/>
    </div>

    <div class="block form-group">
    <label for="reference">Référence</label>
    <input type='text' name='reference' id="reference" required="required"/>
    </div>

    <div class="block form-group">
    <label for="qtebonne">Quantité bonne</label>
    <input type='text' name='qtebonne' id="qtebonne" required="required"/>
    </div>


    <div class="block">
    <table>
    <col width="60">

   <tr>
          <th><strong></strong></th>
          <th><strong>M</strong></th>
          <th><strong>AM  </strong></th>
          <th><strong> N</strong></th>
          <th><strong>WE</strong></th>
   </tr>  

   <tr>
    <td>Equipe</td>
    <td><input type="radio" name="equipe" value="M" checked></td>
    <td><input type="radio" name="equipe" value="AM"></td>
    <td><input type="radio" name="equipe" value="N"></td>
    <td><input type="radio" name="equipe" value="WE"></td>
    </tr>
    </table>
    </div>


      <div class="block">  
      <input type="submit" value="Submit" class="action" onclick="form_data()"/>
      <input type="button" value="Close" onclick="google.script.host.close()"/>
    </div> 



    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
    </script>


    </form>


        <script>
    document.querySelector("#myform").addEventListener("submit", 
    function(e)
    {
    e.preventDefault();    //stop form from submitting
    google.script.run.addNewItem(this);
     google.script.host.close();//close this dialogbox
    }
    );

    </script>


  </body>
</html>

Это в code.gs: 

function onOpen() 
{
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('Remplissage')
  .addItem('Ajout Item', 'addItem')
      .addToUi();
}

function addItem()
{
  var html = HtmlService.createHtmlOutputFromFile('form');
  SpreadsheetApp.getUi() 
      .showModalDialog(html, 'Ajout Nouvel Item');

}



function addNewItem(form_data)
{  

  var sheet = SpreadsheetApp.getActive();

  //sheet.insertColumnAfter(sheet.getLastColumn());


  var cellA = sheet.getCurrentCell();
  cellA.setValue([form_data.date]);

  var cellB = cellA.offset(1, 0); //+1 pour la ligne en dessous
  cellB.setValue([form_data.reference]);

  var cellC = cellB.offset(1, 0); //+2 pour la ligne encore en dessous
  cellC.setValue([form_data.qtebonne]);


  var cellD = cellC.offset(1, 0); //+3 pour la ligne encore en dessous
  cellD.setValue([form_data.equipe]);


}

Вот как это выглядит в Excel:

введите описание изображения здесь

1 Ответ

1 голос
/ 28 января 2020

В форме. html: 

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
  </head>
  <body>
    <form id="myform">



    <div class="block form-group">
    <label for="date">Date</label>
    <input type='date' name='date' id="date" required="required"/>
    </div>

    <div class="block form-group">
    <label for="reference">Référence</label>
    <input type='text' name='reference' id="reference" required="required"/>
    </div>

    <div class="block form-group">
    <label for="type">Code rebut</label>
    <input type='text' name='type' id="type" required="required"/>
    </div>

    <div class="block form-group">
    <label for="qtebonne">Quantité bonne</label>
    <input type='number' name='qtebonne' id="qtebonne" required="required"/>
    </div>

    <div class="block form-group">
    <label for="qte_rebut">Quantité rebut</label>
    <input type='number' name='qte_rebut' id="qte_rebut" required="required"/>
    </div>



    <div class="block">
    <table>
    <col width="60">

   <tr>
          <th><strong></strong></th>
          <th><strong>M</strong></th>
          <th><strong>AM  </strong></th>
          <th><strong>N</strong></th>
          <th><strong>WE</strong></th>
   </tr>  

   <tr>
    <td>Equipe</td>
    <td><input type="radio" name="equipe" value="M" checked></td>
    <td><input type="radio" name="equipe" value="AM"></td>
    <td><input type="radio" name="equipe" value="N"></td>
    <td><input type="radio" name="equipe" value="WE"></td>
    </tr>
    </table>
    </div>


    <div class="block">  
      <input type="submit" value="Submit" class="action" id="Submit"/>
      <input type="button" value="Close" onclick="google.script.host.close()"/>
      <INPUT type="reset" value="Reset">
    </div> 



    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
    </script>


    </form>


    <script>
    document.querySelector("#myform").addEventListener("submit", 
    function (e) {
      e.preventDefault();    //stop form from submitting
      google.script.run.addNewItem(this);
   //   google.script.host.close();//close this dialogbox

    });



 /*   function clearForm() {
  document.getElementById('date').value = "";
  document.getElementById('reference').value = "";
  document.getElementById('type').value = "";
  document.getElementById('qtebonne').value = "";
  document.getElementById('type').value = "";
  document.getElementById('qte_rebut').value = "";
}

    document.getElementById("SubmitAndContinueInput").addEventListener("click", myFunctionContinue);

    function myFunctionContinue(e) {
  e.preventDefault();
  var obj = document.getElementById("CheckDetailsForm");
  var x = document.getElementById("vendor-selector").value;
  document.getElementById("CompanyName").innerHTML = x;
  google.script.run
    .withSuccessHandler(clearForm)
    .functionToRunOnFormSubmit(obj);
}


    document.querySelector("#myform").addEventListener("SubmitAndContinueInput", 
    function (e) {
      e.preventDefault();    //stop form from submitting
      google.script.run.addNewItem(this);
  google.script.run
    .withSuccessHandler(clearForm)

    }); */



    </script>


  </body>
</html>

В code.gs: 

function onOpen() 
{
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('Remplissage')
  .addItem('Ajout Item', 'addItem')
      .addToUi();
}

function addItem()
{
  var html = HtmlService.createHtmlOutputFromFile('form').setHeight(500);
  SpreadsheetApp.getUi() 
      .showModalDialog(html, 'Ajout Nouvel Item');
  }



function addNewItem(form_data)
{  

  var sheet = SpreadsheetApp.getActiveSheet();

  // On détecte la dernière colonne
  var lastColumn = detectLastColumn();

  Logger.log(form_data);

  // On récupère les quatre premières cellules de la dernière colonne
  var header = sheet.getRange(1, lastColumn, 4, 1);




  // Parce que on form_data.date a la forme yyyy-mm-dd donc :
  // split('-') donne une liste ['yyyy', 'mm', 'dd']
  // reverse() donne ['dd', 'mm', 'yyyy']
  // join('/') donne dd/mm/yyyy comme on veut :)
  var formattedDate = form_data.date.split('-').reverse().join('/');

  $today = new Date();
  $yesterday = new Date($today);
  $yesterday.setDate($today.getDate() - 1);

  var $dd = $yesterday.getDate();
  var $mm = $yesterday.getMonth()+1; //January is 0!
  var $yyyy = $yesterday.getFullYear();

  if($dd<10){$dd='0'+$dd} if($mm<10){$mm='0'+$mm} 
  $yesterday = $dd+'/'+$mm+'/'+$yyyy;




  // On y ajoute directement les 4 valeurs voulues dans l'ordre
  var data = [[formattedDate], [form_data.reference], [form_data.qtebonne], [form_data.equipe]];
  header.setValues(data);




  Logger.log(form_data.type);

  var typeRows = findTypeRanges(form_data.type)
  Logger.log(typeRows);

  for (var i = 0; i < typeRows.length; i++) {
    Logger.log('rowindex: ' + typeRows[i])
    sheet.getRange(typeRows[i], lastColumn).setValue(form_data.qte_rebut)
  }
}

// Fonction qui va rechercher toutes les lignes correspondant au type passé en argument
function findTypeRanges(type) {
  var sheet = SpreadsheetApp.getActiveSheet();
  var firstRow = 7 // première ligne à laquelle commence les trucs
  var typeCol = 4 // colonne des types

  var lastRow = detectLastRow(firstRow, typeCol);
  var typesRange = sheet.getRange(firstRow, typeCol, lastRow - firstRow + 1, 1);

  // D'après la doc ça permet de chercher dans une range
  var textFinder = typesRange.createTextFinder(type);
  var allOccurences = textFinder.findAll(); // Chercher toutes occurences

   return allOccurences.map(function (range) {
      return range.getRow(); // Transforme toutes les ranges en juste la ligne
   });
}

// Fonction pour détecter la dernière colonne remplie
function detectLastColumn() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var content = sheet.getRange('F1').getDisplayValue();

  var col = 6; // Parce que la colonne qui nous interesse commence à 'F'
  while (content !== '') {
    col++;
    content = sheet.getRange(1, col).getDisplayValue();
  }
  Logger.log('Last Column: ' + col)

  return col;
}

function detectLastRow(firstRow, typeColumn) {
  var sheet = SpreadsheetApp.getActiveSheet();

  var content = sheet.getRange(firstRow, typeColumn).getDisplayValue();

  var row = firstRow; 
  while (content !== '') {
    row++;
    content = sheet.getRange(row, typeColumn).getDisplayValue();
  }

  Logger.log('Last Row: ' + row); 

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

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

...