web-dev-qa-db-fra.com

OnClick vs OnClientClick pour un asp: CheckBox?

Quelqu'un sait-il pourquoi un gestionnaire javascript côté client pour asp: CheckBox doit être un attribut OnClick = "" plutôt qu'un attribut OnClientClick = "", comme pour asp: Button?

Par exemple, cela fonctionne: 

<asp:CheckBox runat="server" OnClick="alert(this.checked);" />

et ce n'est pas (pas d'erreur):

<asp:CheckBox runat="server" OnClientClick="alert(this.checked);" />

mais cela fonctionne: 

<asp:Button runat="server" OnClientClick="alert('Hi');" />

et ça ne marche pas (erreur de compilation):

<asp:Button runat="server" OnClick="alert('hi');" />

(Je sais à quoi sert Button.OnClick; je me demande pourquoi CheckBox ne fonctionne pas de la même manière ...)

asp.netjavascriptcheckboxonclickonclientclick
83
Stobor

C'est très bizarre. J'ai vérifié la page de documentation CheckBox qui lit

<asp:CheckBox id="CheckBox1" 
     AutoPostBack="True|False"
     Text="Label"
     TextAlign="Right|Left"
     Checked="True|False"
     OnCheckedChanged="OnCheckedChangedMethod"
     runat="server"/>

Comme vous pouvez le constater, aucun attribut OnClick ou OnClientClick n'est défini. 

Gardant cela à l'esprit, je pense que c'est ce qui se passe. 

Quand tu fais ça,

<asp:CheckBox runat="server" OnClick="alert(this.checked);" />

ASP.NET ne modifie pas l'attribut OnClick et le restitue tel quel dans le navigateur. Il serait rendu comme:

  <input type="checkbox" OnClick="alert(this.checked);" />

De toute évidence, un navigateur peut comprendre «OnClick» et met en alerte. 

Et dans ce scénario

<asp:CheckBox runat="server" OnClientClick="alert(this.checked);" />

Encore une fois, ASP.NET ne changera pas l'attribut OnClientClick et le rendra comme

<input type="checkbox" OnClientClick="alert(this.checked);" />

Comme le navigateur ne comprend pas OnClientClick, rien ne se passera. Cela ne soulèvera pas non plus d'erreur car ce n'est qu'un autre attribut.

Vous pouvez confirmer ci-dessus en regardant le code HTML rendu. 

Et oui, ce n'est pas intuitif du tout. 

101
SolutionYogi

Parce que ce sont deux types de contrôles différents ... 

Vous voyez, votre navigateur Web ne connaît pas la programmation côté serveur. il ne connaît que son propre DOM et les modèles d'événement qu'il utilise ... Et pour les événements de clic des objets qui lui sont rendus. Vous devez examiner le balisage final envoyé par ASP.Net au navigateur pour voir les différences vous-même.

<asp:CheckBox runat="server" OnClick="alert(this.checked);" />

rend à 

<input type="check" OnClick="alert(this.checked);" />

et 

<asp:CheckBox runat="server" OnClientClick="alert(this.checked);" />

rend à

<input type="check" OnClientClick="alert(this.checked);" />

Maintenant, autant que je puisse m'en souvenir, il n'y a pas de navigateur qui supporte l'événement "OnClientClick" dans leur DOM ...

En cas de doute, affichez toujours la source de la sortie telle qu'elle est envoyée au navigateur ... vous pouvez voir tout un monde d'informations de débogage.

9
datacop

Vous avez raison, c'est incohérent. Ce qui se passe, c’est que CheckBox n’AVE PAS d’événement OnClick côté serveur; votre balise est donc restituée au navigateur. http://msdn.Microsoft.com/en-us/library/system.web.ui.webcontrols.checkbox_events.aspx

Attendu que Button a un OnClick - ASP.NET attend donc une référence à un événement dans votre balise OnClick.

8
russau

Pour ceux d'entre vous qui sont venus chercher le gestionnaire OnClick côté serveur, c'est OnCheckedChanged

5
Serj Sagan

Je nettoyais les avertissements et les messages et je constate que VS en avertit: Validation (ASP.Net): l'attribut 'OnClick' n'est pas un attribut valide de l'élément 'CheckBox'. Utilisez le contrôle de saisie html pour spécifier un gestionnaire côté client. Dans ce cas, vous n'obtiendrez pas la balise span supplémentaire ni les deux éléments.

1
BrianK

Vous pouvez faire le tag comme ceci:

<asp:CheckBox runat="server" ID="ckRouteNow" Text="Send Now" OnClick="checkchanged(this)" />

La propriété .checked dans le JavaScript appelé sera correcte ... l'état actuel de la case à cocher:

  function checkchanged(obj) {
      alert(obj.checked)
  }
0
Alan Simpson

Asp.net CheckBox n'est pas la méthode prise en charge OnClientClick. 
Si vous souhaitez ajouter un événement javascript à asp: CheckBox, vous devez ajouter des attributs connexes sur les événements "Pre_Render" ou "Page_Load" du code serveur:

C #: 

    private void Page_Load(object sender, EventArgs e)
    {
        SomeCheckBoxId.Attributes["onclick"] = "MyJavaScriptMethod(this);";
    }

Remarque: veillez à ne pas définir AutoEventWireup = "false" dans l'en-tête de page.

VB: 

    Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Load
        SomeCheckBoxId.Attributes("onclick") = "MyJavaScriptMethod(this);"
    End Sub
0
Ярослав Белобородов