jQuery con ASP.NET Web Forms para un servidor dev edad pobres

Question

bien, ser un desarrollador del servidor, este vudú activado javascript en la página ASP.NET (basado en una página maestra) rendida en el cliente es un poco demasiado para mí, lo que parece: -)

decidí probar a usar jQuery para manejar algunos del lado del cliente la activación y desactivación de elementos de interfaz de usuario.

Tengo dos botones de radio (rbnDoLimit y rbnDontLimit), y tres casillas de verificación (months12, months24, months36) - si hago clic en rbnDoLimit, me gustaría permitir que los tres de ellos, si hago clic en rbnDontLimit, me gusta para borrar y desactivar las tres casillas. Parece bastante simple, ¿verdad?

Así que he descargado e incluyó jQuery 1.3.2 en mi formulario web ASP.NET 3.5 -. Funciona bien, puedo mostrar una "alerta" en el $ (document) evento ready

Mis dos botones de radio consiguen prestados en la página como:

<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" />

y mis tres casillas de verificación como:

<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>

Yo les adorna con una clase CSS de dcDetails (que no existe - pero está destinado a ser utilizado para la selección de ellos en jQuery). La primera cosa que noté es que la clase CSS no se aplicó a mis elementos <input> como se esperaba, pero sobre un elemento <span> alrededor del <input> ...... (el primer misterio para mí .....). De todos modos .....

Mi primer intento de jQuery es el siguiente:

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

No hubo suerte - Me puede hacer clic en los dos botones de radio todo lo que quiero - no pasa nada. Supongo que esto se debe a que la clase dcDetails CSS está en la <span> alrededor de las casillas de verificación, ¿verdad?

OK - por lo que conseguir un poco más desordenado, pero esto debería trabajar !! Ahora estoy seleccionando las tres casillas en concreto, por su ClientID - esto debe ser exacta y obtener los elementos adecuados, pensé:

<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>

Una vez más, no hubo suerte ......

Entonces, ¿qué diablos me estoy perdiendo ?? Todas estas grandes demostraciones elegantes parece que no puede ayudar a entender por qué esto no está funcionando - ni siquiera un poco .... supongo que me falta algo, muy propios fundamentos básicos - pero simplemente parece que no puede cifra a cabo, lo que es! : -)

Marc

ACTUALIZACIÓN:
no han tenido mucha suerte aún :-( Me desnudé mi muestra a una página HTML simple - pero sigo teniendo este error una y otra y otra vez, no importa cuál de los diversos consejos que trato:

detalles del error de página web

Mensaje: El objeto no admite esta propiedad o método Línea: 3032 Char: 6 Código: 0 URI: file: /// D: /projects/JQuery1/jquery-1.3.2.js

Casi parece ser un error en el interior de jQuery ....... alguna idea?

Actualización 2:
Estoy empezando a pensar que estoy haciendo algo fundamentalmente mal aquí .... Supuse que en la función document.ready (), pude conectar los eventos de clic sobre los dos botones de radio. ¿Me estoy perdiendo de algo? Voy a necesitar para crear una función que llamo desde el cliente del botón de radio "al hacer clic" evento en su lugar? Lo que estoy tratando de hacer, incluso en mi editor HTML (TopStyle 4) - este error "objeto no admite esta propiedad o método" sigue apareciendo todo el tiempo - convenientemente no diciéndome cual objeto que se refiere, ni me dice qué propiedad o método no es compatible ........

O estoy haciendo algo mal tratando de conectar dos funciones de controlador de eventos clic en el document.ready () ??

El reducido, sólo HTML versión está disponible en http://jquery.bluenose.ch/jquerydemo .html para cualquiera que pueda estar interesado - que esperaba para ser capaz de hacer clic en el botón de radio "Do límite" y haga que sea desactivar los tres casillas por debajo de ella - no ir: - (

Answer 1

Me tomó un vistazo a su ejemplo y había algunos problemas de sintaxis.

Su ejemplo:

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

Usted se echa en falta la "función () {" después de la lista y su correspondiente "}" al final. La coma entre el hacer clic en eventos debería haber sido un punto y coma. Eliminar el ": de entrada" de los selectores de jQuery. Esto debería funcionar para usted:

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

Answer 2

Trate de cambiar:

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

a:

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

y

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

a:

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

Answer 3

La respuesta de Uso Kieron y luego ...

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

también podría ser cambiado a:

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

Answer 4

Para desactivar una casilla de verificación (cualquier control), utilizo el siguiente

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

Para habilitar una casilla de verificación (cualquier control), utilizo el siguiente

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

Para responder a su pregunta,

<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>