Bonjour.

Je dispose d'un formulaire HTML, donc le code très simplifié est le suivant:

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
<form action="action.php" method="post">
<input id="Text1" type="text" />
<input id="Submit1" type="submit" value="submit" />
</form>
Quand on clique sur le bouton "submit", il y a un long chargement avant de voir apparaitre le résultat sur la page.
Malheureusement, pendant ce long chargement, on peut cliquer à nouveau plusieurs sur le bouton "submit"...

Je souhaiterais donc afficher une barre de progression pendant ce long chargement et faire en sorte que le clic sur le bouton "submit" ne fonctionne plus.
Par exemple :
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
<progress id="barre-progression" max="100" value="0" onload="Progress();"></progress> 
<span id="lbl-avancement">0 %</span>
Et un code JavaScript pour animer cette barre de progression qui pourrait par exemple ressembler à ceci :
Code JavaScript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
function Progress(){
var valeurAvancement = 0;
var barreProgression = document.getElementById('barre-progression');
var avancement = document.getElementById('lbl-avancement');
valeurAvancement +=5;
if(valeurAvancement <= barreProgression.max){
barreProgression.value = valeurAvancement;
avancement.innerHTML = valeurAvancement.toString() + ' %';
setTimeout('Progress()', 500);}
else{
clearTimeout();
}
}
Pourriez-vous, s'il vous plait, m'aider à résoudre les problématiques suivantes:
Quel code JavaScript, à mettre dans la fonction Progress(), permet de détecter l'état d'avancement du chargement du résultat du formulaire?
Quel événement faut-il utiliser, dans la balise HTML <progress>, pour lancer la barre de progression? (Est-ce onload?)

Merci.