Accueil

Des boutons réactifs en Asp.net

by Jean-Camille Mercier 30. juin 2015 10:31

Un tweak rapide pour désactiver un bouton dès que l'utilisateur a cliqué dessus pour éviter les appels multiples au serveur. Ajouter le onLoad pour prendre la main en code behind :

<asp:Button ID="btSave" runat="server" CommandName="Update" 
            Text="Enregistrer" OnLoad="AddDisableEvent" />

Et ajouter du code javascript en concervant le callBack du click :

protected void AddDisableEvent(object sender, EventArgs e)
{
    var btSave = sender as Button;
    if (btSave != null)
    {
        // Ajouter le disabled du bouton enregistrer
        btSave.Attributes.Add("onclick", "this.disabled=true; this.value='En cours ...'; " 
            + ClientScript.GetPostBackEventReference(btSave, null) + ";");
    }

}

Et un deuxième pour confirmer une action coté client :

<script type="text/javascript">
    function displayBox() {
        if (confirm("Voulez-vous ... blabla ... ?") == true)
        { return true; }
        else
        { return false; }
    }
</script>

et

<asp:LinkButton runat="server" Text="Envoyer" CommandArgument="<%# Item.Id %>"
                OnClick="Envoyer_Click"  OnClientClick="return displayBox();" />

Le "OnClick" n'est pas appelé si le OnClientClick renvoie false !

Bien pratique pour rendre son UI plus réactive.