Get checkbox value from controlgroup

Get checkbox value from controlgroup

by Akram kamal

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/overcast/jquery-ui.css">
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdn.rawgit.com/ehynds/jquery-ui-multiselect-widget/master/jquery.multiselect.css">
<form>
<div class="level_group">
   <label for="level_1">Beginner</label>
   <input type="checkbox" name="level_1" id="level_1" class="level_1" checked="true" />
   <label for="level_2">Intermediate</label>
   <input type="checkbox" name="level_2" id="level_2" class="level_2" />
   <label for="level_3">Expert</label>
   <input type="checkbox" name="level_3" id="level_3" class="level_3" />
</div>

</form>


<div id="result"></div>

JavaScript

$(document).ready(function() {
	$('.level_group')
		.controlgroup()
		.on('change', function() {
			$('#result').html(
				$('.level_1').prop('checked')  + ' - ' +
				$('.level_2').prop('checked')  + ' - ' +
				$('.level_3').prop('checked') +  ' - ' +
                $("form").serialize()
			);
		})
		.trigger('change');
});