JQUERY найти верхний родитель и получить div в нем, кроме этого - PullRequest
Новая
       18

JQUERY найти верхний родитель и получить div в нем, кроме этого

1 голос
/ 15 мая 2009 
1) when i clicked to any checkbox, 
  a) i want to select radio in the same div 
  b) unselect the other radios with their checkboxes. 

2) When i click to radio, 
  a) select all checkboxes in the same div.
  b) uncheck the other radios

3) is there any way to get parents without its first parent div?

Как я могу это сделать? 

<div class="topDiv">
    <div class="repeaterDiv"><input type="radio" id="rpt_01_rb" />
        <input type="checkbox" id="rpt_01_cb1" />
        <input type="checkbox" id="rpt_01_cb2" />
        <input type="checkbox" id="rpt_01_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_02_rb" />
        <input type="checkbox" id="rpt_02_cb1" />
        <input type="checkbox" id="rpt_02_cb2" />
        <input type="checkbox" id="rpt_02_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_03_rb" />
        <input type="checkbox" id="rpt_03_cb1" />
        <input type="checkbox" id="rpt_04_cb2" />
        <input type="checkbox" id="rpt_05_cb3" />
    </div>
</div>

Ответы [ 3 ]

2 голосов
/ 15 мая 2009

Это должно работать и быть намного эффективнее, чем у DrJokepu: 

$(function() {
    $('.repeaterDiv>:radio').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).siblings(':checkbox').attr('checked','checked');
    });

    $('.repeaterDiv>:checkbox').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).attr('checked','checked').siblings(':radio').attr('checked','checked');
    });
});

В качестве примечания, вы должны убедиться, что все переключатели имеют одинаковое имя, чтобы соответствовать стандартам ...

Если есть какая-то странная причина, по которой вы не можете этого сделать, вы можете изменить последнюю строку блока привязки флажка (как бы неприглядно это ни было) на: 

$(this)
    .attr('checked','checked')
    .parent().siblings('.repeaterDiv').find(':radio')
    .removeAttr('checked');

    // I prefer to break the chain here but...
    // you could continue the above chain by doing: 
    // '.end().end().end().siblings(':radio').attr('checked','checked');'

$(this).siblings(':radio').attr('checked','checked');
0 голосов
/ 15 мая 2009 
// when a radio is clicked, unselect any checkboxes in other groups
$('div.topDiv input[type=radio]').click(function() {
    $('div.topDiv div.repeaterDiv').not($(this).parent(".repeaterDiv")).children("input[type=checkbox]").attr('checked', '');
});

// when a checkbox is checked, and it's radio isn't, "click" its radio
// which in turn unchecks other boxes using event defined above
$('div.topDiv input[type=checkbox]').click(function() {
    if (!$(this).siblings('input[type=radio]').attr('checked')) {
        $(this).siblings('input[type=radio]').trigger('click');
    }
});

Это снимет флажки в любых других группах опций радио. То же самое замечание, что и у других людей RE: опции радио требуют общего имени.

0 голосов
/ 15 мая 2009

Убедитесь, что все переключатели имеют одинаковое имя: 

<input type="radio" id="rpt_01_rb" name="rpt_rb" />
<input type="radio" id="rpt_02_rb" name="rpt_rb" />
// etc...

Затем попробуйте следующий код (я его не проверял): 

$('div.repeaterDiv>input[type=checkbox]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=radio]:first').attr('checked', 'checked');
    });
});

$('div.repeaterDiv>input[type=radio]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=checkbox]').attr('checked', 'checked');
    });
});

Что здесь происходит?

Первая часть проходит через флажки в div и прикрепляет обработчик событий к каждому из них. Этот обработчик событий проверяет переключатель в том же div.

Аналогично, вторая часть проходит через переключатели в div, присоединяет обработчик событий, который проверяет все флажки в одном div.

Если вы не забыли убедиться, что переключатели имеют одно и то же имя, отмена других переключателей должна выполняться браузером автоматически.

...