Hello TomiG.,
In the following example you will find only one jqxSwitchButton without the form from Switch Button demo. You can post the button state with ‘checked’ and ‘unchecked’ events, how it is shown below:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxswitchbutton.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
<script type="text/javascript" src="../../scripts/demos.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#button1').jqxSwitchButton({ height: 27, width: 81, checked: true });
$('.jqx-switchbutton').on('checked', function (event) {
$('#events').text('Checked');
});
$('.jqx-switchbutton').on('unchecked', function (event) {
$('#events').text('Unchecked');
});
});
</script>
<style type="text/css">
.settings-setter {
float: left;
margin-right: 14px;
margin-top: 8px;
}
.events-container {
margin-left: 20px;
}
</style>
</head>
<body>
<div class="settings-setter">
<div id="button1"></div>
</div>
<div class="events-container">
<div>Events:</div>
<div id="events"></div>
</div>
</body>
</html>
Best Regards,
Nadezhda
jQWidgets team
http://www.jqwidgets.com/
