Allow parent selection
HTML
<script src="http://emtolis.gr/tsamigr/ccombo/libs/jquery.ba-outside-events.min.js"></script>
<script src="http://emtolis.gr/tsamigr/ccombo/v2.0/jquery.combo.js"></script>
<link rel="stylesheet" href="http://emtolis.gr/tsamigr/ccombo/v2.0/css/style.css">
<h1>ccombo - Allow parent selection in tree format</h1>
<hr />
<div class='buttons'>
<input class='stylishBut ' id ='create' type='button' value='Create ccombo' />
</div>
<hr /><br />
<div class='example'>
<div id='allow'></div>
</div>
<div class='example'>
<div id='notAllow'></div>
</div>
<select id="group" multiple="multiple">
<optgroup LABEL="Firefox">
<option LABEL="2.0 or higher">Firefox 2.0 or higher</option>
<option LABEL="1.5.x">Firefox 1.5.x</option>
<option LABEL="1.0.x">Firefox 1.0.x</option>
</optgroup>
<optgroup LABEL="Microsoft Internet Explorer">
<option LABEL="7.0 or higher">Microsoft Internet Explorer 7.0 or higher</option>
<option LABEL="6.x">Microsoft Internet Explorer 6.x</option>
<option LABEL="5.x">Microsoft Internet Explorer 5.x</option>
<option LABEL="4.x">Microsoft Internet Explorer 4.x</option>
</optgroup>
<optgroup LABEL="Microsoft Internet Explorer 9">
<option LABEL="B1">Beta 1</option>
<option LABEL="B2">Beta 2</option>
<option LABEL="B3">Beta 3</option>
<option LABEL="B4">Beta 4</option>
</optgroup>
<optgroup LABEL="Opera">
<option LABEL="9.0 or higher">Opera 9.0 or higher</option>
<option LABEL="8.x">Opera 8.x</option>
<option LABEL="7.x">Opera 7.x</option>
</optgroup>
<option >Safari</option>
<option >Other</option>
</select>
CSS
.stylishBut {
background: none repeat scroll 0 0 #F0F7FB;
border: 1px solid #B8CFE5;
color: #1C94C4;
cursor: pointer;
font-size: 11px;
font-weight: bold;
height: 25px;
min-width: 70px;
padding: 2px;
}
.stylishBut:hover{
background: none repeat scroll 0 0 #FDFADA; border: 1px solid #FBCB09;
color: #C77405 !important;
font-weight: bold;
}
.buttons{
margin-bottom:10px;
}
JavaScript
jQuery(document).ready(function() {
jQuery('#create').click(
function() {
var created = jQuery('#allow').combo({
'selectId': 'group',
'select_categories': true
});
var created = jQuery('#notAllow').combo({
'selectId': 'group',
'select_categories': false
});
});
});