jQuery mit ASP.NET WebForms für einen armen alten Server dev

Question

OK, einen Server-Entwickler zu sein, diese Javascript Voodoo auf der ASP.NET-Seite (basierend auf einer Masterseite) auf dem Client gerendert ist ein bisschen zu viel für mich, wie es scheint: -)

ich jQuery zu versuchen, entschied sich für eine clientseitige Aktivierung und Deaktivierung von UI-Elementen zu behandeln.

Ich habe zwei Radio-Buttons (rbnDoLimit und rbnDontLimit) und drei Kontrollkästchen (months12, months24, months36) - wenn ich auf rbnDoLimit klicken, ich möchte alle drei von ihnen ermöglichen, wenn ich auf rbnDontLimit klicken, Ich mag die drei Kontrollkästchen zu löschen und deaktivieren. Scheint einfach genug, nicht wahr?

Also habe ich heruntergeladen und enthalten jQuery 1.3.2 in meinem ASP.NET 3.5 Webformular -. OK funktioniert, kann ich eine "alert" Anzeige auf der $ (document) .ready Ereignis

Meine zwei Radio-Buttons auf der Seite als gerenderte heraus bekommen:

<input id="ctl01_cphContent_pnlBasicInfo_rbnDontLimit" 
       type="radio" name="ctl01$cphContent$pnlBasicInfo$LimitMVD" 
       value="False" checked="checked" />
<input id="ctl01_cphContent_pnlBasicInfo_rbnDoLimit" 
       type="radio" name="ctl01$cphContent$pnlBasicInfo$LimitMVD" 
       value="True" />

und meine drei Kontrollkästchen wie:

<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months12" 
      type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months12" /></span>
<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months24" 
      type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months24" /></span>
<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months36" 
      type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months36" /></span>

Ich versah sie mit einer CSS-Klasse von dcDetails (die es nicht gibt -, sondern soll für die Auswahl sie in jQuery verwendet werden soll). Das erste, was mir aufgefallen ist, dass die CSS-Klasse auf meine <input> Elemente nicht angewendet wurde, wie erwartet, aber auf ein <span> Element um die <input> ...... (das erste Geheimnis für mich .....). Wie auch immer .....

Meine erste jQuery Versuch sieht wie folgt aus:

<script type="text/javascript">
    $(document).ready(
        $("#<%= rbnDontLimit.ClientID %>").click(function() {
            $(".dcDetails").attr('disabled','false'); 
        },
        $("#<%= rbnDoLimit.ClientID %>").click(function() {
            $(".dcDetails").attr('disabled','true'); 
        });
</script>

Kein Glück - ich kann auf den beiden Radiobuttons klicken alles, was ich will - nichts passiert. Ich nehme an, das liegt daran, dass die dcDetails CSS-Klasse auf dem <span> um das Kontrollkästchen ist, nicht wahr?

OK - so ist es ein bisschen unordentlicher, aber dies sollte arbeiten !! Jetzt bin ich die Auswahl der drei Kontrollkästchen speziell durch ihre ClientID - dies sollte genau und erhalten die richtigen Elemente sein, dachte ich:

<script type="text/javascript">
    $(document).ready(
        $("#<%= rbnDontLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").attr('disabled','false'); 
            $("#<%= months24.ClientID %>").attr('disabled','false'); 
            $("#<%= months36.ClientID %>").attr('disabled','false'); 
        },
        $("#<%= rbnDoLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").attr('disabled','true'); 
            $("#<%= months24.ClientID %>").attr('disabled','true'); 
            $("#<%= months36.ClientID %>").attr('disabled','true'); 
        });
</script>

Wieder kein Glück ......

Also, was zum Teufel bin ich dabei ?? Alle diese großen pfiffigen Demos kann nicht scheinen, um mir zu helfen zu verstehen, warum dies nicht funktioniert - nicht einmal ein wenig .... Ich denke, ich bin etwas fehlt sehr einfach, sehr Grundlagen - aber ich kann einfach nicht scheinen, um Figur heraus, was das ist! : -)

Marc

UPDATE:
haben nicht viel Glück noch :-( Ich abgespeckte meine Probe auf eine Barebone-HTML-Seite hatte - aber ich halte diesen Fehler immer und immer und immer wieder mit, egal welche der verschiedenen Tipps, die ich versuchen:

Seite Fehlerdetails

Nachricht: Das Objekt unterstützt diese Eigenschaft oder Methode Line: 3032 Char: 6 Code: 0 URI: file: /// D: /projects/JQuery1/jquery-1.3.2.js

Fast scheint ein Fehler tief in jQuery ....... irgendwelche Ideen zu sein?

UPDATE 2:
Ich bin zu denken beginnen, ich etwas grundlegend falsch hier tue .... ich davon aus, dass in der document.ready () Funktion, konnte ich die Click-Ereignisse auf den beiden Radiobuttons anschließen. Bin ich etwas fehlt hier? Würde ich brauche eine Funktion zu erstellen, die ich aus dem Optionsfeld des Client aufrufen „auf Klick“ Ereignis statt? Was auch immer ich versuche zu tun, auch in meinem HTML-Editor (TopStyle 4) - dieser Fehler „Objekt nicht diese Eigenschaft oder Methode nicht unterstützt“ hält die ganze Zeit Aufspringen - bequem weder sagt mir was Objekt, das es sich bezieht, noch mir zu sagen, welche Eigenschaft oder diese Methode nicht unterstützt wird ........

Oder mache ich etwas falsch versucht, zwei Click-Ereignishandler-Funktionen im document.ready hook up () ??

Die abgespeckte, nur HTML Version finden Sie unter http://jquery.bluenose.ch/jquerydemo .html für jeden, der interessiert sein könnte - ich auf dem „Do Limit“ Radio-Button klicken, um in die Lage zu erwarten, und es hat die drei Kontrollkästchen darunter deaktivieren - no go: - (

Answer 1

habe ich einen Blick auf Ihr Beispiel und es gab einige Syntax Probleme.

Ihr Beispiel:

 $(document).ready(
    $('#rbnDontLimit').click(function() {
        $(".dcDetails :input").removeAttr('disabled');
    }),
    $("#rbnDoLimit").click(function() {
        $('.dcDetails :input').attr('disabled', 'true');
    }));

Sie fehlten die „function () {“ nach der bereit und der entsprechenden „}“ am Ende. Das Komma zwischen den Ereignissen klicken sollte ein Semikolon gewesen sein. Entfernen Sie die „: Eingabe“ von den jQuery-Selektoren. Dies sollte für Sie arbeiten:

   $(document).ready(function() {
        $('#rbnDontLimit').click(function() {
            $(".dcDetails").removeAttr('disabled');
        });
        $("#rbnDoLimit").click(function() {
            $('.dcDetails').attr('disabled', true);
        });
    });

Answer 2

Versuchen Sie,:

$("#<%= months12.ClientID %>").attr('disabled','false')

zu:

$("#<%= months12.ClientID %>").attr('disabled','disabled')

und

$("#<%= months12.ClientID %>").attr('disabled','true')

zu:

$("#<%= months12.ClientID %>").attr('disabled','')

Answer 3

Mit Kieron Antwort und dann ...

$("#<%= rbnDontLimit.ClientID %>").click(function() {
            $(".dcDetails").attr('disabled','false'); 
}

auch geändert werden könnte, um:

$("#<%= rbnDontLimit.ClientID %>").click(function() {
            $(".dcDetails > :checkbox").attr('disabled','disabled'); 
}

Answer 4

Um eine Checkbox (keine Kontrolle) zu deaktivieren, verwende ich die folgende

$("#chkSomething").attr("disabled", "true")

Um eine Checkbox (keine Kontrolle) zu aktivieren, verwende ich die folgende

$("#chkSomething").removeAttr("disabled")

Um Ihre Frage zu beantworten,

<script type="text/javascript">
    $(document).ready(
        $("#<%= rbnDontLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").removeAttr("disabled"); 
            $("#<%= months24.ClientID %>").removeAttr("disabled"); 
            $("#<%= months36.ClientID %>").removeAttr("disabled"); 
        },
        $("#<%= rbnDoLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").attr('disabled','true'); 
            $("#<%= months24.ClientID %>").attr('disabled','true'); 
            $("#<%= months36.ClientID %>").attr('disabled','true'); 
        });
</script>