Hi, it's Annabelle.
I have this HTML code that I'm writing for an app that I like to call Ceremony Script Generator. On the Wedding Ceremony Builder section of this app, there's a page I'm writing about extra ceremonies. I've built a button that says, "Disable These", and I'm trying to make JAWS recognize it as a "Toggle Button". However, I'm having trouble figuring out how to make JAWS see it as such. In any web browser I view this page, it doesn't seem to make JAWS announce that this button is a toggle button. Here's the code I have so far. Tell me if this looks right to you.
<html>
<head>
<title>Toggle Button</title>
<script>
function disableCheckBoxes(){
var elmnts = document.getElementsByTagName("input");
for (var i=0; i < elmnts.length; i++) {
elmnts[i].checked=false;
}
}
</script>
</head>
<body>
<label class="checkbox">
<input value="goodDeedsCeremony" name="optionalCeremonies" type="checkbox">
Coin Ceremony
</label>
</div>
</div>
<div class="col-sm-4">
<label class="checkbox">
<input value="plantingCeremony" name="optionalCeremonies" type="checkbox">
Tree-Planting
</label>
</div>
</div>
<div class="col-sm-4">
<label class="checkbox">
<input value="dancingCeremony" name="optionalCeremonies" type="checkbox">
Didgeridoo Circle
</label>
</div>
</div>
</div>
<button class="btn btn-default" aria-pressed="false" onClick="javascript:disableCheckBoxes()">
Disable These
</button>
</body>
</html>