(GSheets) Sélecteur de feuille à partir d'un sidebar avec des boutons radio

Le 22/12/2020 à 16:35

Bonjour,

Voici un outil permettant de sélectionner une feuille dans le "sidebar" d'une feuille de calcul (google sheets) avec des boutons radio.

https://docs.google.com/spreadsheets/d/1_Q1Ym9Pk-5HhR3sbJvVcoeZkta_V8nCQvE5Zqm24Erk/copy

Le code est le suivant :

le fichier Code.gs positionne le bouton sidebar pour le lancement de la barre latérale etc......

function onOpen(e) {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu('🎭Sidebar🎭')
  .addItem('Lancement', 'showSidebar')
  .addToUi();
}
function showSidebar(){
  var ui = SpreadsheetApp.getUi();
  var html = HtmlService
    .createTemplateFromFile("index")
    .evaluate();

  html.setTitle("Boutons Radio customisé");
  ui.showSidebar(html);
 } 
  // Crée une fonction d'importation ou d'inclusion pour que les fichiers puissent être ajoutés
// à l'intérieur de l'index principal.
function include(filename){
  return HtmlService.createHtmlOutputFromFile(filename)
   };

function monresult(txt){
try {
 var valide = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(txt).activate();
 txt ="";

  }
 catch(err) {
  var valide = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
     // Ctrl + enter pour voir le journal des erreurs
   Logger.log(err);
   Browser.msgBox('Vous n\'avez pas choisi de feuille ou il n\'y a pas la feuille demandée ');
 }
 //google.script.host.close();
};

function listeFeuilles() {
  var out = new Array()
  var f = SpreadsheetApp.getActiveSpreadsheet().getSheets();
  for (var i=0 ; i<f.length ; i++) out.push( [ f[i].getName() ] )
  return out 
}

le fichier index.html est le suivant

<!DOCTYPE html>
<html>

<body>
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<p>Votre choix d'onglet</p>
  <? var data = listeFeuilles(); ?>

  <form>

    <? 
    for (var i = 0; i < data.length; i++) { ?>
      <input type="radio" name="onglet" value="<?= data[i] ?>"><?= data[i] ?><br>
    <? } ?>

  </form>

        <br>
        <div id="lastButtonBlock" class="block">
            <button onclick="myFunction()" class ="action button actionButton" > Valider l'Onglet  </button>
            <button onclick="google.script.host.close()" class ="create deleteButton actionButton" >Fermer le dialogue  </button>
        </div>
        <br>
        <div class="sidebar bottom">
         <img src="data:image/jpeg;base64,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" alt="21318">

            <span class="gray"> Réalisé par gilbert.rgi en 2020</span>
        </div>

</body>

<script>
    function myFunction() {
  var x = (document.forms.length)-1;
  var onglet = document.forms[x];
  var txt = "";
  var i;
  for (i = 0; i < onglet.length; i++) {
    if (onglet[i].checked) {
      txt = txt + onglet[i].value ; // + " ";
    }
  }
   google.script.run.monresult([txt])

   for (i=0; i < onglet.length; i++){
            //Si balise de type radio on met checked = false
                if(onglet[i].type == 'radio') { onglet[i].checked = false};
          }
  };
</script>

</html>

La page html est avec mon logo grâce aux indications de Sébastien ,

Merci également à Steelson pour son aide.

Rechercher des sujets similaires à "gsheets selecteur feuille partir sidebar boutons radio"