Untitled
unknown
plain_text
2 years ago
8.1 kB
11
Indexable
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer">
</head>
<body class="has-background-light">
<section class=" section column is-half is-offset-one-quarter has-background-white ">
<!--?!= include("image.html")?-->
<section class="section">
<section class="hero is-primary is-bold">
<div class="hero-body">
<div class="container has-text-centered">
<h1 class="title is-size-5">Inserisci i documenti per completare
l'iscrizione</h1>
</div>
</div>
</section>
<div class="container mt-4 ml-4">
<h1>Gentile
<!--?= cognome ?-->
<!--?= nome ?-->, carica i file richiesti: </h1>
</div>
<form id="mainForm" class="container m-4" onsubmit="send(this)">
<div class="field is-hidden">
<div class="pt-3"> <label class="label">Cognome</label>
<div class="control"> <input class="input" name="cognome" readonly="readonly"
value="<?=cognome" ?="" type="text">> </div>
</div>
</div>
<div class="field is-hidden">
<div class="pt-3"> <label class="label">Nome</label>
<div class="control"> <input class="input" name="nome" readonly="readonly"
value="<?=nome" ?="" type="text">> </div>
</div>
</div>
<div class="field is-hidden">
<div class="pt-3"><label class="label">CF</label>
<div class="control"> <input class="input" name="codFis" readonly="readonly"
value="<?=" codfis="" ?="" type="text">> </div>
</div>
</div>
<div class="field is-hidden">
<div class="pt-3"><label class="label">Email</label>
<div class="control"> <input class="input" name="email" readonly="readonly"
value="<?=" email="" ?="" type="text"> > </div>
</div>
</div>
<div class="field is-hidden">
<div class="pt-3"><label class="label">Sessione Esame</label>
<div class="control"> <input class="input" name="sessioneEsame" readonly="readonly"
value="<?=" sessioneesame="" ?="" type="text"> > </div>
</div>
</div>
<!-- <div class="columns">
<div class="column is-full has-text-white has-background-primary has-text-weight-bold" >Allega i documenti</div> </div> -->
<div class="field">
<div class=" pt-3">
<div class="mb-3">
<p class="is-size-5 has-text-weight-bold ">Documento-1 *</p>
<p class="is-size-6 has-text-weight-light mb-2">Allegare
Documento di Identità (Fronte-Retro / Fronte)</p>
<div id="upFile1" class="file has-name is-primary"> <label class="file-label">
<input class="file-input" name="upFile1" required="" type="file">
<span class="file-cta"> <span class="file-icon"> <i class="fas fa-upload"></i>
</span> <span class="file-label"> Scegli un file… </span>
</span> <span class="file-name" width="300px"> Nessun file
selezionato </span> </label> </div>
</div>
</div>
</div>
<div class="field mt-5">
<div class="mb-3">
<p class="is-size-5 has-text-weight-bold ">Documento-2</p>
<p class="is-size-6 has-text-weight-light mb-2">Allegare Documento
di Identità (Fronte-Retro / Fronte)</p>
<div id="upFile2" class="file has-name is-primary"> <label class="file-label">
<input class="file-input" name="upFile2" type="file"> <span class="file-cta">
<span class="file-icon"> <i class="fas fa-upload"></i> </span>
<span class="file-label"> Scegli un file… </span> </span>
<span class="file-name" width="300px"> Nessun file selezionato
</span> </label> </div>
</div>
</div>
<div class="field mt-5">
<p class="is-size-5 has-text-weight-bold ">Pagamento-1 *</p>
<p class="is-size-6 has-text-weight-light mb-2">Allegare Ricevuta di
Pagamento (Fronte-Retro / Fronte)</p>
<div id="upFile3" class="file has-name is-primary"> <label class="file-label">
<input class="file-input" name="upFile3" required="" type="file">
<span class="file-cta"> <span class="file-icon"> <i class="fas fa-upload"></i>
</span> <span class="file-label"> Scegli un file… </span> </span>
<span class="file-name" width="300px"> Nessun file selezionato </span>
</label> </div>
</div>
<br>
<div class="control"> <button type="submit" id="submitBTN" class="button is-primary">Invia</button>
</div>
</form>
</section>
<div id="modal" class="modal">
<div id="modalBg" class="modal-background"></div>
<div class="modal-content">
<div class="box">
<p>Invio file ok</p>
</div>
</div>
<button class="modal-close is-large" aria-label="close"></button> </div>
<script>
// Prevent forms from submitting.
function preventFormSubmit() {
var forms = document.querySelectorAll('form');
for (var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', function(event) {
event.preventDefault();
});
}
}
window.addEventListener('load', preventFormSubmit);
const upFile1 = document.querySelector('#upFile1 input[type=file]');
upFile1.onchange = () => {
if (upFile1.files.length > 0) {
const fileName = document.querySelector('#upFile1 .file-name');
fileName.textContent = upFile1.files[0].name;
}
}
const upFile2 = document.querySelector('#upFile2 input[type=file]');
upFile2.onchange = () => {
if (upFile2.files.length > 0) {
const fileName = document.querySelector('#upFile2 .file-name');
fileName.textContent = upFile2.files[0].name;
}
}
const upFile3 = document.querySelector('#upFile3 input[type=file]');
upFile3.onchange = () => {
if (upFile3.files.length > 0) {
const fileName = document.querySelector('#upFile3 .file-name');
fileName.textContent = upFile3.files[0].name;
}
}
let modal = document.getElementById('modal')
let modalBg = document.getElementById('modalBg')
modalBg.addEventListener('click', () => {
modal.classList.remove('is-active')
})
let submitBTN = document.getElementById('submitBTN')
let mainForm = document.getElementById("mainForm")
function send(formObject){
submitBTN.classList.add('is-loading')
google.script.run.withSuccessHandler(() => {
submitBTN.classList.remove('is-loading')
mainForm.reset()
modal.classList.add('is-active')
}).processForm(formObject)
}
</script> </section>
</body>
</html>
Editor is loading...
Leave a Comment