submit() apres un disabled

**zimeau** · 06/04/2012, 16h04

Bonjour,
J'ai développé un logiciel en PHP, mon problème étant que parfois les utilisateurs click 2 fois sur un bouton car le serveur met parfois un peu de temps à répondre. du coup, les fonctions sont parfois lancé 2 fois, donc 2 entrées dans la base de données.je voudrais donc désactiver le bouton tant que la page n'a pas fini de charger. j'ai trouvé quelque chose de fonctionnel avec javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<? echo $_POST['FinPause']; ?>
<form action='liste.php' method='post' id='form'>
<input type='submit' name='FinPause' value='FinPause' style='width:200px; height:50px' id='FinPause' OnClick='this.disabled=1; submit();' />
</form>

ça marche parfaitement, mon bouton est grisé jusqu'a ce que la page ai fini de charger, mais le problème est que ce qui est dans mon form n'est pas envoyé à la page liste.php. si je fais :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type='submit' name='FinPause' value='FinPause' style='width:200px; height:50px' id='FinPause' OnClick='submit();' />

je recupere bien mon $_POST['FinPause']. si je fais :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type='submit' name='FinPause' value='FinPause' style='width:200px; height:50px' id='FinPause' OnClick='this.disabled=1;' />

mon bouton est bien grisé. l'association des 2 ne marche par contre pas.
j'ai essayé de passer par une fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<head>
<SCRIPT language="Javascript">
function Chargement() {
	document.getElementById('FinPause').disabled = 'disabled';
	document.forms["form"].submit();
}
</SCRIPT>
</head>
<body> 
<? echo $_POST['FinPause']; ?>
<form action='liste.php' method='post' id='form'>
<input type='submit' name='FinPause' value='FinPause' style='width:200px; height:50px' id='FinPause' OnClick='Chargement();' /></form>
</body>

Le problème reste le même. est-il possible de faire l'envoie de ma form par javascript? car finalement, des que je met OnClick='this.disabled=1;', c'est comme si le type du bouton n’était plus un submit. il ne charge la page qu'en rajoutant submit, et les données ne sont pas envoyé.
Merci d'avance de votre aide!

**Doopeijii** · 06/04/2012, 16h29

Tu peux appeler un fonctions js qui commence par griser ton bouton puis qui récupère les données de ton formulaire et se charge de les soumettre à un script php! Tu n'as plus besoin d'un submit mais juste d'un button le js se charge du reste !

**Bovino** · 06/04/2012, 16h41

Tout d'abord, mettre submit() dans un bouton de type submit n'a aucun sens !

Ensuite, tu te trompes au niveau de l'enchainement des événements.
Lorsque tu cliques sur le bouton, tu le désactives (et un input désactivé n'est pas transmit) puis le formulaire est soumis, c'est le contraire qu'il faut faire :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<form onsubmit="document.getElementById('FinPause').disabled = true">

**zimeau** · 10/04/2012, 09h06

Désolé pour la réponse tardive, week end oblige. Merci pour vos réponse.
Je replonge donc dans mon code en essayant ton code Bovino :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<? echo $_POST["FinPause"]; ?>
<form action="liste.php" method="post" id="form" OnSubmit="document.getElementById('FinPause').disabled = 'disabled'" >
<input type="submit" name="FinPause" value="FinPause" style="width:200px; height:50px" id="FinPause" />
</form>

Malheureusement, il n'est pas efficace

il ne fait pas le submit et ne grise pas le bouton.
En suivant tes conseil, j'ai tenté de mettre l'envoie du formulaire avant de désactiver le bouton :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
function Chargement() {
  document.forms['form'].submit();
  document.getElementById('FinPause').disabled = "disabled";
}

Le problème reste le même. Je me demande si il n'attend pas que le formulaire soit transmit avant de désactiver le bouton, solution qui ne me conviendrais pas vraiment, puisque je veux justement éviter que l'utilisateur envoie plusieurs fois le formulaire.
Merci encore de votre aide!
EDIT : J'ai oublié de préciser que je travaille sous opéra, et je viens de me rendre compte que le javascript ne fonctionne pas correctement avec ce navigateur. je refais des tests avec firefox...

**zimeau** · 10/04/2012, 10h53

Je reposte une réponse suite à mes tests sur firefox :
j'ai tenté le code suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<? echo $_POST["FinPause"]; ?>
<form method="post" onsubmit="document.getElementById('FinPause').disabled = true">
<input type="submit" name="FinPause" value="FinPause" >
</form>

cela ne grise pas le bouton.
J'ai trouvé quelque chose d'efficace, a un détail prés :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="submit" value="Fin Pause" name="FinPause" onClick="this.form.submit();this.disabled=true;this.value='Patientez...'" />

ça marche très bien, malheureusement j'ai vu que lors de l'utilisation de submit(), la valeur du bouton n'est pas transmise. De plus, comme l'a dit Bovino, faire un submit dans un bouton submit... bref, j'ai presque trouver une solution en mettant la valeur du bouton dans un type hidden. le probleme est que dans mon formulaire, j'ai 3 boutons, et qu'en fonction du bouton clické, je n'effectue pas les même actions. du coup, le type hidden marche si je n'ai qu'un bouton, pas si j'en ai plusieurs. existe t-il une solution pour ce probleme?
Merci!

**Doopeijii** · 10/04/2012, 11h00

Ton hidden ne marche que pour un bouton... ça veut dire? Que quand tu te sers de tes autres boutons il n'est pas envoyé?
Si c'est ça, il a une valeur par défaut ton hidden? On peut voir le code?

**zimeau** · 10/04/2012, 17h32

En faite, en fonction du bouton clické (donc de la présence de $_POST['Bouton1'], $_POST['Bouton2'], $_POST['Bouton3']... ) je faisais une action précise. si je mettais un hidden, le probleme est que peut importe le bouton, il est toujours présent.
Mais j'ai trouver une solution! Je met un hidden vide de la façon suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type='hidden' name='BoutonEnvoyer' value=''>

puis dans chacun de mes boutons, je rajoute le code javascript suivant pour remplir la valeur de l'hidden :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
onclick='BoutonEnvoyer.value="bouton1";form.submit();this.disabled=true;this.value="Patientez..."'
onclick='BoutonEnvoyer.value="bouton2";form.submit();this.disabled=true;this.value="Patientez..."'
onclick='BoutonEnvoyer.value="bouton3";form.submit();this.disabled=true;this.value="Patientez..."'

et j'arrive à récupérer quel bouton a été clické avec $_POST['BoutonEnvoyer'].
Voila, merci de votre aide!

submit() apres un disabled

JavaScript

Discussions similaires

Partager

Partager