Javascript-форум - optgroup в мультиселекте

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - optgroup в мультиселекте (https://javascript.ru/forum/dom-window/42886-optgroup-v-multiselekte.html)

optgroup в мультиселекте

Всем привет! подскажите пожалуйста пример скрипта, есть мультиселект -

<select id="e_skills" class="skill_changer" multiple="multiple">
<optgroup id="44" label="Группа1">
<option value="137,44">mission impossible</option>
<option value="138,44">ahtung</option>
<option value="139,44">protocol 12</option>
</optgroup>
<optgroup id="67" label="Группа2">
<option value="121,67">post</option>
<option value="128,67">query</option>
<option value="130,67">good</option>
<option value="131,67">sss</option>
</optgroup>
</select>

нужно что бы щёлкнув по названию группы выбирались все пункты этой группы.

Цитата:

Сообщение от vladislav.blinov

что бы щёлкнув по названию группы выбирались все пункты этой группы

На именно название optgroup нет такого события...

Делай свой селект. ;)

Цитата:

Делай свой селект.

я бы с удовольствием, но нужен именно bootstrap multiselect. И что события на optgroup нету знаю, но нужно создать, вот я и дербаню его уже второй день.

я тут немного разобрался, поразмыслил и получилось следующее -

groupAll: function() {
            this.$element.find('option').prop('selected', true).attr('selected', 'selected');
            this.render();
        },

find находит все - ('option') и отчекивает следовательно тоже все. А вот как задать поиск ('option') в определённом optgroup не могу понять...

Цитата:

Сообщение от vladislav.blinov

А вот как задать поиск ('option') в определённом optgroup не могу понять...

"Усилить" селектор! ;)

$('#44 > option');
$('optgroup[label="Группа2"] > option');

Спасибо за совет:thanks: , в итоге получилось:

$('#44').find('option').prop('selected', true).attr('selected', 'selected');

а как можно определить что все option в группе отчекнуты, чтобы при повторном нажатии выделение снималось?

Цитата:

Сообщение от vladislav.blinov

а как можно определить что все option в группе отчекнуты

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
	$('optgroup').click(function (){
		if ($(this).children('option:not("[selected]")').length) {
			$(this).children('option').attr('selected',true);
		} else {
			$(this).children('option').attrRemove('selected');
		};
	});
});
</script>
</head>
<body>
<select id="e_skills" class="skill_changer" multiple="multiple">
	<optgroup id="44" label="Группа1">
		<option value="137,44">mission impossible</option>
		<option value="138,44">ahtung</option>
		<option value="139,44">protocol 12</option>
	</optgroup>
	<optgroup id="67" label="Группа2">
		<option value="121,67">post</option>
		<option value="128,67">query</option>
		<option value="130,67">good</option>
		<option value="131,67">sss</option>
	</optgroup>
</select>
</body>
</html>

Заработало! :dance: плохо только что сам до всего не додумался но думаю придёт всё с опытом. ksa спасибо за советы:thanks:
кому интересно вот окончательный вариант моего скриптика

var selectActive = $("#id").find('option:not("[selected]")').length;
    if(selectActive == 0){
        $("#id").find('option').prop('selected', false).removeAttr('selected');
        $("#e_skills").selectpicker('render');
    }else{
        $("#id").find('option').prop('selected', true).attr('selected', 'selected');
        $("#e_skills").selectpicker('render');
    }