JQuery множественного выбора виджетов с выбираемым OPTGROUP

Question

Ищу виджет JQuery, который выглядит следующим образом:

Это позволяет иметь несколько групп, например:

Group 1 
- Sub 1 1 
- Sub 1 2 
- Sub 1 3 
Group 2 
- Sub 2 1 
Group 3 
- Sub 3 1 
- Sub 3 2 

При нажатии на 1-й группы например, выберете все внутри, а щелчок снова отменит выбор. А также вы сможете свернуть группы для лучшей навигации. Как видно на картинке (маленькая стрелка слева)

Есть ли такой виджет?

Благодаря

Answer 1

JQuery:

$(document).ready (function() 
{ 
    $('.parent').click(function() { 
     var set = false; 
     if ($(this).is(':checked')) 
      set = true; 
     $(this).parent().find('ul li').each(function() { 
      var Input = $(this).find('input'); 
      Input.attr('checked', set); 
     });  
    }); 
    $('span').click(function() { 
     if ($(this).text() == '-') 
      $(this).html('+'); 
     else 
      $(this).html('-'); 
     $(this).parent().find('ul li').each(function() { 
      $(this).slideToggle(); 
     }); 
    }); 
}); 

HTML-:

<ul> 
    <li> 
     <span>-</span><input type="checkbox" value="a" class="parent" /> a 
     <ul> 
     <li><input type="checkbox" value="a1" /> a1</li> 
     <li><input type="checkbox" value="a2" /> a2</li> 
     </ul> 
    </li> 
    <li> 
     <span>-</span><input type="checkbox" value="b" class="parent" /> b 
     <ul> 
     <li><input type="checkbox" value="b1" /> b1</li> 
     <li><input type="checkbox" value="b2" /> b2</li> 
     </ul> 
    </li> 
</ul> 

Приветствия

EDIT: Добавлен коллапс.

Answer 2

Этот маленький jsfiddle я соединял должен делать то, что вы хотите:

http://jsfiddle.net/RdaCy/

Чтобы добавить больше групп/sub_groups просто изменить идентификационные номера соответственно :), если есть какой-либо аспект вы хотели бы, чтобы я изменить или, если вам нужно еще рука просто скажите :)