Désactiver le bouton après l'envoi

Question

J'essaie de désactiver un bouton lorsqu'un utilisateur soumet un formulaire de paiement et que le code pour publier le formulaire provoque un double post dans Firefox. Ce problème ne se produit pas lorsque le code est supprimé et n'apparaît dans aucun navigateur autre que Firefox.

Une idée comment empêcher le double post ici?

System.Text.StringBuilder sb = new StringBuilder(); 
sb.Append("if (typeof(Page_ClientValidate) == 'function') { "); 
sb.Append("if (Page_ClientValidate() == false) { return false; }} "); 
sb.Append("this.value = 'Please wait...';"); 
sb.Append("this.disabled = true;"); 
sb.Append(Page.GetPostBackEventReference(btnSubmit)); 
sb.Append(";"); 
btnSubmit.Attributes.Add("onclick", sb.ToString()); 

c'est la sb.Append ligne (Page.GetPostBackEventReference (btnSubmit)) qui est l'origine du problème

Merci

EDIT: Voici le C# du bouton:

<asp:Button ID="cmdSubmit" runat="server" Text="Submit" /> 

Voici le code

Ce code poste deux fois (et désactive le bouton de soumission et vérifie l'entrée):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="if (typeof(Page_ClientValidate) == 'function') { if (Page_ClientValidate() == false) { return false; }} this.value = 'Please wait...';this.disabled = true;document.getElementById('ctl00_MainContent_cmdBack').disabled = true;__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" /> 

Ce code des postes deux fois (mais ne pas désactiver le bouton d'envoi):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" /> 

Ce message de code une fois (mais ne vérifie pas l'entrée d'utilisateur et ne désactive pas la le bouton d'envoi):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" id="ctl00_MainContent_cmdSubmit" /> 

Ce message de code une fois (mais ne désactivez pas le bouton soumettre):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$cmdSubmit&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="ctl00_MainContent_cmdSubmit" /> 

Ce code ne publie pas du tout:

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="this.disabled = true;WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$cmdSubmit&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="ctl00_MainContent_cmdSubmit" /> 

De toute évidence, il est la désactivation du bouton d'envoi qui est de poser le problème. Avez-vous des idées sur la façon dont nous pouvons désactiver la soumission pour éviter les clics multiples?

Answer 1

Vraisemblablement, btnSubmit a déjà un événement côté serveur connecté. Si c'est le cas, l'appel à Page.GetPostBackEventReference ne devrait pas être nécessaire. Vous devriez obtenir votre comportement désiré simplement en supprimant cette ligne. Mise à jour: Vous avez mentionné l'ajout du gestionnaire d'événements au code C#, mais vous ne mentionnez pas où vous faites cela. Je suppose que c'est dans le gestionnaire Page_Load. Si tel est le cas, cela ne fonctionnerait pas correctement, car il est trop tard pour raccorder un gestionnaire d'événement de clic de bouton à ce stade. Essayons cela à la place. D'abord, il serait plus propre de placer le JS dans sa propre fonction plutôt que de le construire dans le code C# derrière. Je vous suggère de le mettre dans un bloc de script

function disableOnSubmit(target) 
{ 
    if (typeof(Page_ClientValidate) == 'function') { 
     if (Page_ClientValidate() == false) { return false; } 
    } 
    target.value = 'Please wait...'; 
    target.disabled = true; 
    return true; 
} 

Et pour votre bouton ASPX, essayez ceci (ou mieux encore, il est propre fichier .js.):

<asp:Button ID="cmdSubmit" runat="server" Text="Submit" onclick="btnSumbit_Click" OnClientClick="return disableOnSubmit(this);" /> 

Answer 2

retirer cette ligne, le formulaire sera déjà soumis car il s'agit d'un bouton de soumission, pas un type de bouton standard, regardez comment ASP.NET rend l'élément.

Les validateurs de page sont appelés dans le rappel form.onsubmit, donc si votre page n'est pas valide, elle sera validée ici. Donc, supprimez simplement cette ligne et vous serez défini.

Answer 3

private void checkButtonDoubleClick(Button button) 
    { 
     System.Text.StringBuilder sbValid = new System.Text.StringBuilder(); 
     sbValid.Append("if (typeof(Page_ClientValidate) == 'function') { "); 
     sbValid.Append("if (Page_ClientValidate() == false) { return false; }} "); 
     sbValid.Append("this.value = 'Please wait...';"); 
     sbValid.Append("this.disabled = true;"); 
     sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, "")); 
     sbValid.Append(";return false;"); 
     button.Attributes.Add("onclick", sbValid.ToString()); 
    } 

Answer 4

La réponse est l'ajout d'un retour false; après votre dernière ligne;

par exemple

sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, "")); 
sbValid.Append(";"); 

doit être

sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, "")); 
sbValid.Append(";return false;"); 

ce vraiment travaillé pour moi.

Answer 5

Essayez ci-dessous le code

<asp:Button ID="cmdSubmit" runat="server" Text="Submit" onclick="btnSumbit_Click" OnClientClick="this.style.display = 'none';"/> 

Answer 6

Essayez ceci:

<asp:Button ID="btn" runat="server" Text="something" onclick="btn_Click" 
ValidationGroup="V1" onClientClick="if(Page_ClientValidate('V1')) 
{this.disabled=true;this.value='Please Wait....';__doPostBack(this.id);} 
"UseSubmitBehavior="false" />