OnClick vs OnClientClick für eine asp: CheckBox?

Question

Wer weiß, warum ein JavaScript-Handler auf der Client-Seite für asp: CheckBox ein Attribut OnClick = "" sein muss und nicht ein Attribut OnClientClick = ", wie bei asp: Button?

Zum Beispiel funktioniert das:

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

und dies nicht (kein Fehler):

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

aber dies funktioniert:

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

und dies nicht (Kompilierzeitfehler):

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

(Ich weiß, was Button.OnClick ist; Ich frage mich, warum CheckBox nicht auf die gleiche Weise funktioniert ...)

Answer 1

Das ist sehr seltsam. Ich die CheckBox documentation page geprüft, die

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

liest Wie man sehen kann, gibt es keine OnClick oder OnClientClick Attribute definiert.

In diesem Sinne denke ich, ist das was passiert.

Wenn Sie das tun,

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

ASP.NET verändert nicht die OnClick Attribut und macht es wie auf dem Browser. Es wäre gemacht werden als:

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

Offensichtlich kann ein Browser verstehen ‚OnClick‘ und stellt eine Warnung aus.

Und in diesem Szenario

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

Wieder ASP.NET nicht das OnClientClick Attribut ändern und wird es als

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

Als Browser verstehen nicht OnClientClick nichts machen wird passieren. Es wird auch keinen Fehler verursachen, da es nur ein anderes Attribut ist.

Sie können oben bestätigen, indem Sie auf das gerenderte HTML schauen.

Und ja, das ist überhaupt nicht intuitiv.

Answer 2

Sie haben Recht, das ist inkonsistent. Was passiert, ist, dass CheckBox kein serverseitiges OnClick-Ereignis hat, also wird Ihr Markup zum Browser gerendert. http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.checkbox_events.aspx

Während Schaltfläche hat ein OnClick - so erwartet ASP.NET einen Verweis auf ein Ereignis in Ihrem OnClick-Markup.

Answer 3

Weil sie zwei verschiedene Arten von Kontrollen sind ...

Sehen Sie, Ihren Web-Browser nicht weiß, über serverseitige Programmierung. es weiß nur von seinem eigenen DOM und den verwendeten Ereignismodellen ... und von Klickereignissen von gerenderten Objekten.Sie sollten das endgültige Markup überprüfen, das tatsächlich von ASP.Net an den Browser gesendet wird, um die Unterschiede selbst zu sehen.

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

macht zu

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

und

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

macht zu

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

nun so nahe wie ich mich erinnern kann, gibt es überall keinen Browser, die die Unterstützung "OnClientClick" -Event in ihrem DOM ...

Im Zweifelsfall immer die Quelle der Ausgabe anzeigen, wie sie an den Browser gesendet wird ... es gibt eine ganze Welt von Debug-Informationen, die Sie sehen können.

Answer 4

Ich war Aufräumen Warnungen und Meldungen und sehen, dass VS darüber warnt: Validation (ASP.Net): Attribut ‚OnClick‘ kein gültiges Attribut des Elements ‚CheckBox‘ ist. Verwenden Sie das Eingabesteuerelement von html, um einen clientseitigen Handler anzugeben, und Sie erhalten dann das zusätzliche span-Tag und die zwei Elemente nicht.

Answer 5

Für diejenigen von euch, die hier wurde für die serverseitige OnClick Handler sucht es OnCheckedChanged

Answer 6

Eine Lösung ist, ist mit JQuery:

$(document).ready(
    function() { 
     $('#mycheckboxId').click(function() { 
       // here the action or function to call 
     }); 
    } 
); 

Answer 7

Sie können wie folgt den Tag tun:

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

Die .checked-Eigenschaft im aufgerufenen JavaScript ist korrekt ... der aktuelle Status des Kontrollkästchens:

function checkchanged(obj) { 
     alert(obj.checked) 
    }