테이블의 모든 하위 컨트롤을 사용/사용하지 않도록 설정하려면 어떻게해야합니까?

Question

나는 테이블과 그 서브 컨트롤을 사용 가능하게하고 싶을 때 체크 박스를 가지고 있으며, 비활성화되었을 때 그 반대를하고 싶다.

나는 테이블의 모든 subControls를 반복해야한다는 것을 이미 알고 있으며, 나의 훌륭한 질문은 그것이 훌륭하고 일반적인 방법이 있는지의 여부이다. 사전에

감사합니다,

온스

Answer 1

예를 들어 (Prototype.js 사용) 프레임 워크를 사용하여 선택기와 클래스 이름을 사용하는 것이 훨씬 쉽습니다.

이 항목을 클릭하면 'mycontrols'클래스의 모든 항목을 사용하도록 설정합니다.

$('containerDiv').select('.mycontrols').each(function(element){element.disabled=false}) 

Answer 2

당신은 jQuery이 작업을 수행 할 수 있습니다. (모든 텍스트 상자, 버튼, 체크 박스, 라디오 버튼과 드롭 다운을 의미 )를 테이블 내부에 모든 컨트롤을를 활성화/비활성화하는 기능)

<input type="checkbox" onclick="toggleControls(this)"/>Controls Disabled 
<table id="myTable"> 
<tr> 
    <td>Name: <input type="text" /></td> 
    <td>Select: <input type="radio" /></td> 
</tr> ..... 

toggleControls (:의 당신의 HTML이 같다고 가정 해 봅시다

<script> 
    function toggleControls(e){ 
    $('#myTable input,select,textarea').attr('disabled',e.checked); 
    } 
</script> 

jQuery의 CSS 선택기는 한 줄을 사용하여 컨트롤을 사용/사용하지 않도록 설정합니다. 평범한 구식 자바 스크립트의 경우이 함수는 다음과 같습니다.

var myTable = document.getElementById("myTable"); 
var controls= myTable.getElementsByTagName("input"); 
// Repeat the previous line for "select" and "textarea" 
for(i = 0; i < controls.length; i++) { 
    control = controls[i]; 
    control.disabled = !control.disabled;   
}