こんにちは私はオプショングループでドロップダウンの複数選択のためにhttp://www.erichynds.com/jquery/jquery-ui-multiselect-widget プラグインを使用しています。
グループ名もアイテムと一緒に表示したい。私が同じように使用した以下のコードを見つけてください。
<script type="text/javascript">
$(document).ready(function () {
$(".multiselect").multiselect({
selectedList: 10,
noneSelectedText: 'Select Options',
header: false,
show: ['slide', 100],
hide: ['explode', 100], //explode,bounce
height: 200,
multiple: true,
autoOpen: false,
position: {
my: 'center',
my: 'top',
at: 'center',
at: 'bottom'
}
});
var target = $('#<%=hdnftest.ClientID %>');
var a = "";
$(".multiselect").multiselect().bind("multiselectclick multiselectcheckall multiselectuncheckall", function (event, ui) {
var checkedValues = $.map($(this).multiselect("getChecked"), function (input) {
return (input.value + ':' + input.title);
});
target.val(
checkedValues.length
? checkedValues.join(', ')
: 'Please select a checkbox'
);
}).triggerHandler("multiselectclick");
$(".multiselect").multiselect("close");
});
</script>
<select class="multiselect" multiple="multiple">
<optgroup label="EAST">
<option>Testing1</option>
<option>Testing2</option>
<option>Testing3</option>
<option>Testing4</option>
</optgroup>
<optgroup label="NORTH">
<option>Testing5</option>
<option>Testing6</option>
<option>Testing7</option>
<option>Testing8</option>
</optgroup>
<optgroup label="SOUTH">
<option>Testing9</option>
<option>Testing10</option>
<option>Testing11</option>
<option>Testing12</option>
</optgroup>
</select>