Support Article
Unable to select CPMHistory control correctly through keyboard
Summary
When JAWS is engaged, selecting a CPMHistory control through the keyboard does not engage the correct control. It either does not respond or selects a control that does not have the focus.
Error Messages
Not Applicable
Steps to Reproduce
- Use Internet Explorer 11 and JAWS 18
- Launch the Interaction portal
- Launch Demo screen pop up Connor
- Switch the customer inquiry toggle to ON
- Use the keyboard to select the CPMHistory check boxes.
Root Cause
A defect in Pegasystems’ code or rules.
Resolution
Apply HFix-38839
For a simple check box when in accessible mode, perform the following changes in ExpressHistoryToggleControl.
1. Add the following to <style> block.
.customer_checkbox input[type="checkbox"] {
position : absolute;
width : 50px !important;
height : 20px;
margin-top : 5px;
margin-left : 20px;
}
.customer_label {
position: relative;
right: 90px;
top: 5px;
}
2. Replace the contents of the <html> with the following.
<pega:when test="AccessGroup.pyIsAccessible == 'true'">
<div class="customer_checkbox">
<input id="e" type="checkbox" onclick="toggleExpressHistory(this,'<%=interactionClassName%>')" <p:r n="$save(ExpressHistoryChecked)"/> >
<div class="customer_label">
<label for="e" role="presentation">Customer Inquiry</label>
</div>
</div>
</pega:when>
<pega:when test="AccessGroup.pyIsAccessible == 'false'">
<div class="can-toggle demo-rebrand-2">
<input id="e" type="checkbox" onclick="toggleExpressHistory(this,'<%=interactionClassName%>')" <p:r n="$save(ExpressHistoryChecked)"/> >
<label for="e" role="presentation" >
<div class="can-toggle__switch"></div>
<div class="can-toggle__label-text">Customer Inquiry</div>
</label>
</div>
</pega:when>
Published March 24, 2018 - Updated December 2, 2021
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.