J'ai une page HTML avec un formulaire, et je souhaite que les réponses s'ajoutent sur Google Spreadsheet automatiquement. J'utilise donc Google Appscript, mais lors du clic sur le bouton "Envoyer", j'ai l'impression que la fonction liée au onlick ne se lance simplement pas.
Code HTML
<!DOCTYPE html>
<html>
<head>
<base target="_blank">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Licence</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css">
<style>
.disclaimer{width: 480px; color:#646464;margin:20px auto;padding:0 16px;text-align:center;font:400 12px Roboto,Helvetica,Arial,sans-serif}.disclaimer a{color:#009688}#credit{display:none}
</style>
</head>
<body>
<form class="main" id="form" novalidate="novalidate" style="max-width: 480px;margin: 40px auto;">
<div id="forminner">
<div class="row">
<div class="col s12">
<h5 class="center-align teal-text">Demande de licence FFV 2017</h5>
</div>
</div>
<div class="row">
<div class="col s12">
<p class="p1">Pour obtenir votre licence FFV 2017, remplissez ce formulaire, indiquez votre moyen de paiement (chèque ou virement), une fois celui-ci reçu vous recevrez par mail votre numéro de licence.</p>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="firstname" type="text" name="firstname" class="validate" required="" aria-required="true">
<label for="firstname">Prénom</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="lastname" type="text" name="lastname" class="validate" required="" aria-required="true">
<label for="lastname">Nom</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="ecole" type="text" name="ecole" class="validate" required="" aria-required="true">
<label for="ecole">École</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<p for="type">Type</p>
<div>
<input id="type-0" class="validate" name="type" required="required" type="radio" value="Annuelle">
<label for="type-0">Annuelle</label>
</div>
<div>
<input id="type-1" class="validate" name="type" required="required" type="radio" value="Temporaire">
<label for="type-1">Temporaire (4 jours) </label>
</div>
</div>
</div>
<div class="row">
<div class="col s12">
<p class="p2">Pour participer à la 49e Course Croisière EDHEC, la souscription à une licence FFV annuelle est obligatoire. Pour participer à la Coupe de France Etudiants, une licence temporaire couvrant les 2 jours de régate est suffisante. <br> <br />Prix d'une licence annuelle : 55€ <br> Prix d'une licence temporaire 4 jours : 28€</p>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<p for="moyen_paiement">Type</p>
<div>
<input id="moyen_paiement-0" class="validate" name="moyen_paiement" required="required" type="radio" value="Chèque">
<label for="moyen_paiement-0">Chèque</label>
</div>
<div>
<input id="moyen_paiement-1" class="validate" name="moyen_paiement" required="required" type="radio" value="Virement">
<label for="moyen_paiement-1">Virement</label>
</div>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="numero_licence" type="text" name="numero_licence" class="validate" required="" aria-required="true">
<label for="numero_licence">Numéro de licence</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="naissance" type="date" name="naissance" class="validate" required="" aria-required="true">
<label for="naissance">Date de naissance</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="adresse" type="text" name="adresse" class="validate" required="" aria-required="true">
<label for="adresse">Adresse de facturation</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="mail" type="text" name="mail" class="validate" required="" aria-required="true">
<label for="mail">Adresse email</label>
</div>
</div>
<div class="row">
<div class="input-field col s6">
<button class="waves-effect waves-light btn submit-btn" type="submit" onclick="google.script.run.withSuccessHandler(formSubmitted) .writeForm(this.parentNode); return false;">Envoyer</button>
</div>
</div>
<div class="row">
<div class="input-field col s12" id = "progress">
</div>
</div>
</div>
<div id="success" style="display:none">
<h5 class="left-align teal-text">Demande envoyée</h5>
<p>Votre demande a été soumise</p>
</div>
</form>
<script>
function formSubmitted(status) {
document.getElementById('form').style.display = 'none'; //matches your form name or whatever you want to disappear post-submission
}
</script>
</body>
</html>
Code.gs
function doGet(e) {
return HtmlService
.createTemplateFromFile('form.html')
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.NATIVE)
}
function writeForm(form) {
var firstname = form.firstname;
var lastname = form.lastname;
var ss = SpreadsheetApp.openById('1A6uMdf9Vz4DdpwlIxIHvw8UVOBHYGSvTYz68AzxJAuQ');
var sheet = ss.getSheetByName("Licence");
var newRow = sheet.getLastRow()+1;
var range = sheet.getRange(newRow, 1);
range.setValue(firstname);
range = sheet.getRange(newRow, 2);
range.setValue(lastname);
}
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
