Comment désactiver la publication sur un bouton asp

135

J'ai un bouton asp. C'est côté serveur donc je ne peux le montrer qu'aux utilisateurs connectés, mais je veux qu'il exécute une fonction javascript et il semble que quand c'est runat = "server", il appelle toujours l'événement de publication.

J'ai aussi un bouton régulier ( <input...>) qui ne fonctionne pas sur le serveur et cela fonctionne très bien ...

Comment puis-je faire en sorte que ce bouton n'exécute que le javascript et non la publication?

Dkarzon
la source

Réponses:

263

Demandez à votre javascript de retourner false une fois terminé.

<asp:button runat="server".... OnClientClick="myfunction(); return false;" />
womp
la source
16
Dans de nombreux cas, les gens utilisent un onclick ou OnClientClick avec cette syntaxe <asp: Button OnClientClick = "myFunction ()" /> où myFunction () renvoie false et cela ne suffit pas - vous devez utiliser OnClientClick = "return myFunction ()"
Bron Davies
17
J'ai dû ajouter UseSubmitBehavior = "False" ainsi que; return false
rob
9
Assurez-vous d'ajouter 'CausesValidation = "false"', sinon cela ajoutera 'WebForm_DoPostBackWithOptions' et un tas de balises supplémentaires.
Carter Medlin
Cela n'a pas fonctionné pour moi dans ASP.NET 4+, mais la réponse de Konstantin a tout simplement OnClientClick="return false"fonctionné.
TylerH
39
YourButton.Attributes.Add("onclick", "return false");

ou

<asp:button runat="server" ... OnClientClick="return false" />
Konstantin Tarkus
la source
15

Vous pouvez utiliser l'action de clic jquery et utiliser la fonction preventDefault () pour éviter la publication

<asp:button ID="btnMyButton" runat="server" Text="MyButton" />


$("#btnMyButton").click(function (e) {
// some actions here
 e.preventDefault();
}
Rameez
la source
C'est une réponse élégante car elle vous permet de tester les conditions à désactiver.
John Mott
1
N'utilisez jamais preventDefault car cela arrêtera d'autres événements qui reposent sur cet événement -1
Piotr Kula
1
@ppumkin: preventDefault est un excellent moyen de dire aux autres écouteurs d'événements que vous avez géré cet événement afin qu'ils n'aient pas à le faire. Je pense que vous vouliez dire stopPropagation, qui empêche en effet l'événement d'être entendu par d'autres auditeurs d'événements.
Sebbas
Yeaaaaaaaaaa. non. 4 ans plus tard et je soutiens cela encore plus maintenant. Ne fais rien de tout ça.
Piotr Kula
8

Considère ceci.

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequest);
function BeginRequest(sender, e) {
    e.get_postBackElement().disabled = true;

}
     </script>
Ramakrishnankt
la source
6

Les autres ont raison de dire que vous avez besoin de votre rappel pour renvoyer false; Cependant, j'aimerais ajouter que le faire en réglant le onclick est une vieille façon laide de faire les choses. Je recommanderais de lire sur javascript discret . L'utilisation d'une bibliothèque comme jQuery pourrait vous faciliter la vie et le HTML moins couplé à votre javascript (et jQuery est pris en charge par Microsoft maintenant!)

Neil Williams
la source
4

ASP.NET est toujours généré en asp:Buttontant que fichier input type=submit.
Si vous voulez un bouton qui ne fait pas de publication, mais que vous avez besoin d'un contrôle pour l'élément côté serveur, créez une entrée HTML simple avec les attributs type=buttonet runat=server.

Si vous désactivez les actions de clic OnClientClick=return false, cela ne fera rien au clic, sauf si vous créez une fonction comme:

function btnClick() {
    // do stuff
    return false;
}
Aristide Darlan
la source
3

Vous ne dites pas quelle version du framework .NET vous utilisez.

Si vous utilisez la version 2.0 ou supérieure, vous pouvez utiliser la propriété OnClientClick pour exécuter une fonction Javascript lorsque l'événement onclick du bouton est déclenché.

Tout ce que vous avez à faire pour empêcher une publication sur le serveur est le retour falsede la fonction JavaScript appelée.

OtisAardvark
la source
3

de plus pour la réponse acceptée, vous pouvez utiliser UseSubmitBehavior = "false" MSDN

Arbejdsglæde
la source
ASP.NET ajoute; __doPostBack(à la fin du script de clic client.
IvanH
3

Dans mon cas, j'ai résolu l'ajout de retour dans le onClientClick:

Code derrière

function verify(){
  if (document.getElementById("idName").checked == "") {
    alert("Fill the field");
    return false;
  }
}

Surface de conception

<asp:Button runat="server" ID="send" Text="Send" onClientClick="return verify()" />
Raphael
la source
Comment exécuter la OnClickméthode après cela.
5377037
2

vous pouvez utiliser le code:

<asp:Button ID="Button2" runat="server"
     Text="Pulsa"
     OnClientClick="this.disabled=true"
     UseSubmitBehavior="False"/>

si besoin de soumettre

...
<form id="form1" runat="server" onsubmit="deshabilita()">
...
<script type="text/javascript">
    function deshabilita()
    {
        var btn = "<%= Button1.ClientID %>";
        if (confirm("Confirme postback"))
        {
            document.getElementById(btn).disabled = true;
            return true;
        }
        return false;
    }
</script>

Elvia Soto
la source
2

Avec validation

Dans cet exemple, j'ai utilisé deux contrôles ddlet txtboxun bon codage

 asp:ScriptManager ID="script1" runat="server" /asp:ScriptManager

    asp:UpdatePanel ID="Panel1" runat="server"
       ContentTemplate

// ASP BUTTON
asp:Button ID="btnSave" runat="server" Text="Save" class="btn btn-success" OnClientClick="return Valid()" OnClick="btnSave_Click"


   /ContentTemplate    
    /asp:UpdatePanel    

  <script type="text/javascript">
        function Valid() {

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val() == 0) {
                alert("Please select YOUR TEXT");
                $("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val().length == 0) {
                alert("Please Type YOUR TEXT");
                $("ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }
            return true;
        }
</script>
Praneeth
la source
2

Vous pouvez utiliser JQuery pour cela

<asp:Button runat="server" ID="btnID" />

que dans JQuery

$("#btnID").click(function(e){e.preventDefault();})
Vikas
la source