가난한 오래된 서버 데브를위한 asp.net webforms와 jQuery

StackOverflow https://stackoverflow.com/questions/1306951

문제

좋아, 서버 개발자이기 때문에 클라이언트에서 렌더링 된 ASP.NET 페이지 (마스터 페이지를 기준으로) 의이 JavaScript Voodoo는 나에게 너무 많은 것 같습니다 :-)

나는 jQuery를 사용하여 일부 클라이언트 측면을 활성화하고 UI 요소를 비활성화하려고했습니다.

두 개의 라디오 버튼이 있습니다 (rbnDoLimit 그리고 rbnDontLimit) 및 3 개의 확인란 (months12, months24, months36) - 내가 클릭하면 rbnDoLimit, 내가 클릭하면 세 가지를 모두 활성화하고 싶습니다. rbnDontLimit, 나는 세 개의 확인란을 지우고 비활성화하는 것을 좋아합니다. 충분히 간단 해 보입니다.

그래서 ASP.NET 3.5 WebForm -works OK에 jQuery 1.3.2를 다운로드하고 포함 시켰습니다. $ (Document). Ready 이벤트에 "알림"을 표시 할 수 있습니다.

내 두 개의 라디오 버튼이 페이지에서 다음과 같이 렌더링됩니다.

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

그리고 내 세 가지 확인란은 다음과 같습니다.

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

나는 그들을 CSS 클래스로 장식했다 dcDetails (존재하지 않지만 jQuery에서 선택하는 데 사용됩니다). 가장 먼저 알아 차린 것은 CSS 클래스가 내에 적용되지 않았다는 것입니다. <input> 예상대로 요소이지만 a <span> 주위의 요소 <input>...... (나에게 첫 번째 미스터리 .....). 그래도.....

첫 번째 jQuery 시도는 다음과 같습니다.

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

운이 없습니다 - 내가 원하는 두 개의 라디오 버튼을 클릭 할 수 있습니다. 아무 일도 일어나지 않습니다. 나는 이것이 때문이라고 생각한다 dcDetails CSS 클래스가 있습니다 <span> 확인란 주위에 맞습니까?

좋아 - 그래서 조금 더 지저분 해지지 만 이것은 작동해야합니다 !! 이제 저는 세 가지 확인란을 구체적으로 선택하고 있습니다. ClientID - 이것은 정확하고 올바른 요소를 얻어야한다고 생각했습니다.

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

다시, 운이 없다 ......

그래서 내가 무엇을 놓치고 있습니까 ?? 이 위대한 Snazzy 데모는 모두 이것이 왜 작동하지 않는지 이해하는 데 도움이 될 수 없습니다. 조금도 .... 나는 매우 기본적이고 매우 기본적인 것을 놓치고 있다고 생각합니다. 아서, 그게 뭐야! :-)

마크

업데이트:
아직 운이 좋지 않았습니다 :-( 나는 샘플을 Barebones HTML 페이지로 제거했습니다. 그러나 나는 어떤 다양한 팁 중 어느 것이든 계속 해서이 오류를 계속해서 계속해서 계속 시도합니다.

웹 페이지 오류 세부 정보

메시지 : 객체는이 속성 또는 메소드 라인을 지원하지 않습니다 : 3032 Char : 6 코드 : 0 URI : 파일 : // d : /projects/jquery1/jquery-1.3.2.js

거의 jQuery 내부의 오류 인 것 같습니다 ....... 어떤 아이디어?

UPDATE 2:
나는 여기서 근본적으로 잘못된 일을하고 있다고 생각하기 시작했다 .... 나는 document.ready () 함수에서 두 개의 라디오 버튼의 클릭 이벤트를 연결할 수 있다고 가정했다. 내가 여기서 뭔가를 놓치고 있습니까? Radio Button의 클라이언트 "On Click"이벤트에서 호출하는 기능을 만들어야합니까? 내가하려는 모든 것이 내 HTML 편집기 (Topstyle 4)에서도 -이 오류 "객체는이 속성이나 방법을 지원하지 않습니다"는 항상 계속 팝업됩니다 - 편리하게 팝업됩니다 - 편리하게 팝업됩니다. 어느 것도 아니다 그것이 무엇을 참조하는지 알려주고 ...도 아니다 어떤 속성이나 방법이 지원되지 않는지 알려주세요 ........

아니면 문서에서 두 번의 클릭 이벤트 핸들러 기능을 연결하려고 잘못하고 있습니까?

Scaled Down, HTML 전용 버전은 다음에서 사용할 수 있습니다. http://jquery.bluenose.ch/jquerydemo.html 관심이있는 사람은 누구나 "제한"라디오 버튼을 클릭하고 아래 3 개의 확인란을 비활성화 할 수있을 것으로 예상됩니다.

도움이 되었습니까?

해결책

나는 당신의 예를 살펴보고 구문 문제가있었습니다.

Your example:

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

끝에 "function () {"{ "{"{ "{"{ "{"{ "{"}가 누락되었습니다. To Click 이벤트 사이의 쉼표는 세미콜론이었을 것입니다. jQuery selectors에서 ": 입력"을 제거하십시오. 이것은 당신에게 효과가 있어야합니다 :

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

다른 팁

변경해보십시오 :

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

에게:

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

그리고

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

에게:

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

Kieron의 대답을 사용한 다음 ...

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

다음으로 변경할 수 있습니다.

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

확인란 (모든 컨트롤)을 비활성화하려면 다음을 사용합니다.

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

확인란 (모든 컨트롤)을 활성화하려면 다음을 사용합니다.

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

귀하의 질문에 답하기 위해

<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>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top