Включить | Отключить радио (дочерний) с флажком (родительский)

Question

У меня есть список флажков и радиогрупп, таких как:

<table>
<tr><td colspan=3><input type=checkbox class="filter-checkbox" name=serv1 value=1>ВъездАвто</td></tr> 
<tr>
<td><input type=radio id=servch1 name=servch1 value=6000><a>г/п 10Т</a></td>
<td><a>Сумма:&nbsp;6000</a></td>
<td><a>НДС:&nbsp;1200</a></td>
</tr> 
<tr>

<td><input type=radio id=servch1 name=servch1 value=4200><a>г/п 7Т</a></td>
<td><a>Сумма:&nbsp;4200</a></td>
<td><a>НДС:&nbsp;840</a></td>
</tr> 

<tr>
<td><input type=radio id=servch1 name=servch1 value=3000><a>г/п 5Т</a></td>
<td><a>Сумма:&nbsp;3000</a></td>
<td><a>НДС:&nbsp;600</a></td>
</tr> 

<tr><td><input type=radio id=servch1 name=servch1 value=1800><a>г/п 3Т</a></td>
<td><a>Сумма:&nbsp;1800</a></td>
<td><a>НДС:&nbsp;360</a></td>
</tr> 

<tr><td colspan=3><input type=checkbox class="filter-checkbox" name=serv2 value=2>ХранСутки40фут</td></tr> 
<tr>
<td><input type=radio id=servch2 name=servch2 value=5300><a>гружен.</a></td>
<td><a>Сумма:&nbsp;5300</a></td>
<td><a>НДС:&nbsp;1060</a></td>
</tr> 

<tr><td><input type=radio id=servch2 name=servch2 value=3000><a>порожн.</a></td>
<td><a>Сумма:&nbsp;3000</a></td>
<td><a>НДС:&nbsp;600</a></td>
</tr> 

<tr><td colspan=3><input type=checkbox class="filter-checkbox" name=serv3 value=3>ХранСутки20фут</td>
</tr> 
<tr><td><input type=radio id=servch3 name=servch3 value=2600><a>гружен.</a></td>
<td><a>Сумма:&nbsp;2600</a></td>
<td><a>НДС:&nbsp;520</a></td>
</tr> 

<tr><td><input type=radio id=servch3 name=servch3 value=1600><a>порожн.</a></td>
<td><a>Сумма:&nbsp;1600</a></td>
<td><a>НДС:&nbsp;320</a></td>
</tr> 

<tr><td colspan=3><input type=checkbox class="filter-checkbox" name=serv4 value=4>Очистка конт.</td></tr> 
<tr>
<td><input type=radio id=servch4 name=servch4 value=2700><a>среднетон.</a></td>
<td><a>Сумма:&nbsp;2700</a></td>
<td><a>НДС:&nbsp;540</a></td>
</tr> 

<tr><td><input type=radio id=servch4 name=servch4 value=6300><a>20фут</a></td>
<td><a>Сумма:&nbsp;6300</a></td>
<td><a>НДС:&nbsp;1260</a></td>
</tr> 

<tr><td><input type=radio id=servch4 name=servch4 value=11500><a>40фут</a></td>
<td><a>Сумма:&nbsp;11500</a></td>
<td><a>НДС:&nbsp;2300</a></td></tr> <tr><td></table>

Я хочу включить | отключить дочернюю радиогруппу с его родительским флажком.Пожалуйста, помогите мне.

Answer 1

Если ваш HTML не повредит ...

Допустим, это выглядит так:

<div>
  <input type="checkbox" value="1" name="c1" />
  <input type="radio" name="r1" value="1" />
  <input type="radio" name="r2" value="1" />
</div>
<div>
  <input type="checkbox" value="1" name="c1" />
  <input type="radio" name="r1" value="1" />
  <input type="radio" name="r2" value="1" />
</div>

С помощью jQuery вы можете сделать что-то вроде этого:

$(function(){
  $("input:checkbox").click(function(){
    if ( $(this).is(":checked") ){
      $(this).nextAll("input:radio").attr("disabled",true);
    }
    else{
      $(this).nextAll("input:radio").attr("disabled",null);
    }
  });
});

EDIT

Я бы посоветовал сначала разделить таблицу на TBODY:

    <table>
        <tbody>
            <tr>
                <td colspan=3><input type=checkbox class="filter-checkbox" name=serv1 value=1>ВъездАвто</td>
            </tr> 
            <tr>
                <td><input type=radio id=servch1 name=servch1 value=6000><a>г/п 10Т</a></td>
                <td><a>Сумма:&nbsp;6000</a></td>
                <td><a>НДС:&nbsp;1200</a></td>
            </tr> 
            <tr>
                <td><input type=radio id=servch1 name=servch1 value=4200><a>г/п 7Т</a></td>
                <td><a>Сумма:&nbsp;4200</a></td>
                <td><a>НДС:&nbsp;840</a></td>
            </tr> 
            <tr>
                <td><input type=radio id=servch1 name=servch1 value=3000><a>г/п 5Т</a></td>
                <td><a>Сумма:&nbsp;3000</a></td>
                <td><a>НДС:&nbsp;600</a></td>
            </tr> 
            <tr>
                <td><input type=radio id=servch1 name=servch1 value=1800><a>г/п 3Т</a></td>
                <td><a>Сумма:&nbsp;1800</a></td>
                <td><a>НДС:&nbsp;360</a></td>
            </tr> 
        </tbody>
        <tbody>
            <tr>
                <td colspan=3><input type=checkbox class="filter-checkbox" name=serv2 value=2>ХранСутки40фут</td>
            </tr> 
            <tr>
                <td><input type=radio id=servch2 name=servch2 value=5300><a>гружен.</a></td>
                <td><a>Сумма:&nbsp;5300</a></td>
                <td><a>НДС:&nbsp;1060</a></td>
            </tr> 
            <tr>
                <td><input type=radio id=servch2 name=servch2 value=3000><a>порожн.</a></td>
                <td><a>Сумма:&nbsp;3000</a></td>
                <td><a>НДС:&nbsp;600</a></td>
            </tr>
            .... 

Тогда вы можете сделать это:

$(function(){
  $("table input:checkbox").click(function(){
    if ( $(this).is(":checked") ){
      $(this).parents("tbody").find("input:radio").attr("disabled",true);
    }
    else{
      $(this).parents("tbody").find("input:radio").attr("disabled",null);
    }
});

});