Publié vendredi 9 janvier 2009 18:10 par Luke77

[Tips] Eviter le double click sur un postback

Aujourd'hui je me suis heurté à un petit problème ô combien classique :
Comment interdire les double click sur un Button / LinkButton sans rendre le bouton disabled en grisé tout moche ?

J'ai regarder les solutions sur notre grand ami google, et la plupart utilisent disabled ce que l'on souhaite éviter pour des raisons esthétiques.
La solution que j'ai trouvé cet après-midi (mais qui est loin d'être parfaite pour le moment) : positionner un attribut en plus sur le control pour savoir si on interdit ou non le click, et positionner un appel JavaScript sur le onclick du bouton.
Le JavaScript s'occupant de gérer le blocage du click devant s'assurer au préalable que la validation est passée avec succès avant de bloquer le click.

Voici une première ébauche du code rédigé aujourd'hui :

   1: public class DoubleClickExtender : Control
   2: {
   3:     public DoubleClickExtender()
   4:     {
   5:         PreRender += new EventHandler(DoubleClickExtender_PreRender);
   6:     }
   7:  
   8:     void DoubleClickExtender_PreRender(object sender, EventArgs e)
   9:     {
  10:         // Register validation script
  11:         Page.ClientScript.RegisterClientScriptResource(GetType(), "Vp.Core.Web.UI.Extenders.js");
  12:  
  13:         WebControl control = NamingContainer.FindControl(TargetControlID) as WebControl;
  14:         IButtonControl button = control as IButtonControl;
  15:  
  16:         if (control != null && button != null)
  17:         {
  18:             control.Attributes.Add("onclick", "return CheckAndDisableControl(this);");
  19:             RegisterExpandoAttribute(control, "validationgroup", button.ValidationGroup, true);
  20:             RegisterExpandoAttribute(control, "isblocked", "false", true);
  21:         }
  22:     }
  23:  
  24:     [IDReferenceProperty]
  25:     public string TargetControlID
  26:     {
  27:         get { return ViewState["TargetControlID"] as string; }
  28:         set { ViewState["TargetControlID"] = value; }
  29:     }
  30: }

Et le JavaScript qui va avec :

   1: function CheckAndDisableControl(button)
   2: {
   3:     if (typeof(Page_Validators) == "undefined")
   4:     {
   5:         return Block(button);
   6:     }
   7:     
   8:     if (typeof(Page_ClientValidate) == 'function')
   9:     {
  10:         Page_ClientValidate(button.validationgroup);
  11:         if(Page_IsValid)
  12:         {
  13:             return Block(button)
  14:         }
  15:     }
  16:     else
  17:     {
  18:         return Block(button);
  19:     }
  20: }
  21:  
  22: function Block(control)
  23: {
  24:     if (control.isblocked == "false")
  25:     {
  26:         control.isblocked = "true";
  27:         return true;
  28:     }
  29:     else
  30:     {
  31:         return false;
  32:     }
  33: }

 

Voilà, c'est pas encore parfait, mais ça peut donner des idées à certains qui auraient le même problème ... :-)

Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :

# re: [Tips] Eviter le double click sur un postback @ samedi 10 janvier 2009 10:20

Juste un petit commentaire en passant.

Pense a preciser le langage dans ton titre ou au moins dans le post.

Je suis pas sur que tous les gens qui lisent les blogs comprennent bien en quoi javascript peut influer sur du C#...

NeuroCypher


Les 10 derniers blogs postés

- TechDays Paris 2012 : Comment SharePoint a sauvé mes TechDays par Blog Technique de Romelard Fabrice le il y a 8 heures et 37 minutes

- Perspective 3.0 pour Silverlight 5.0 par Perspective le il y a 9 heures et 58 minutes

- TechDays Paris 2012 : Top 10 des Best Practices pour SQL Server par Blog Technique de Romelard Fabrice le il y a 15 heures et 35 minutes

- TechDays Paris 2012 : Kinect + Office 365 un bon geste pour votre SI par Blog Technique de Romelard Fabrice le il y a 15 heures et 57 minutes

- TechDays Paris 2012 : Pleinière du premier jour par Blog Technique de Romelard Fabrice le il y a 16 heures et 13 minutes

- [SharePoint 2010] Erreur d’analyse de contenu “L’élément SharePoint en cours d’analyse a renvoyé une erreur lors de la demande de données auprès du se... par Julien Chable le il y a 20 heures et 46 minutes

- [TechDays2012] Oui j’y serai! par Blog de Jérémy Jeanson le 02-06-2012, 22:13

- TFS Integration Tools – Suivi des synchronisations avec Reporting Services par Vivien Fabing le 02-05-2012, 17:46

- CSS Content State Selectors (Personnal Draft) par Le blog de FremyCompany le 02-04-2012, 15:38

- MBA : Pourquoi faire et comment le choisir ? par Blog Technique de Romelard Fabrice le 02-03-2012, 14:22