SA-54190

Summary

This issue was encountered using Pega Customer Service for Insurance 7.31 running on Pega 7.3.1.

Text Input's Editable Format Type is configured as Number.

In the Internet Explorer 11 browser, on setting Text Input's Editable Format Type as Number, the Text field accepts alphabets. The field is cleared on clicking outside it.

Error Messages

Not Applicable

Steps to Reproduce

1. Add a text input in a section.
2. In the Presentation tab, configure the Editable Format Type as Number.

Root Cause

A third-party product issue: Browser limitation

When a Text Input control type is set to Number in the Presentation tab, notice the following effects:

• Validation does not trigger, and the field is blank when the form is submitted.
• If a value other than a number is entered, the browser sends an empty value and the value is not validated.
• In the Clipboard, the field value displays as empty.
• If the field is required, the validation displays.

This issue occurs when using both the Chrome and Safari browsers and is a result of browser behavior for the HTML5 type=“number”.
For these browsers, set the type as Text instead of Number in the Presentation tab of a Text Input control.

For Internet Explorer 11 or any browser that supports HTML5, client-side validation for the conditions listed below does not render correctly:

• In Property configuration, when using input control as pxTestInput, pxNumber, or pxCurrency in the General tab
• In Property configuration, Presentation Tab, if input validation is set as Number, at runtime validation error message does not display. For example: 213$#$3 is not a valid integer value.

Resolution

Here's the explanation for the reported behavior:

Pega introduced changes in the UI-kit:07-01-01 RuleSet.
When this ruleset is included in the application ruleset and the user logged in to the application, the user cannot enter a non-integer input.

When controls such as pxTextInput, Integer, pxNumber, and pxCurrency are used, and the input validator is set as a Number, validation is not triggered due to default browser behaviour.

For restricted functionality in the Internet Explorer browser, use the code shown below in the UserWorkForm HTML fragment.

<script> 
pega.u.d.attachOnload(function(){ 

var numberElements=document.querySelectorAll(".ie input[type='number']"); 
debugger; 
for(var i=0;i<numberElements.length;i++){
numberElements[i].addEventListener('keydown', function(e) { 

var key = e.keyCode ? e.keyCode : e.which; 

if (!( [8, 9, 13, 27, 46, 110, 190].indexOf(key) !== -1 || 
(key == 65 && ( e.ctrlKey || e.metaKey ) ) || 
(key >= 35 && key <= 40) || 
(key >= 48 && key <= 57 && !(e.shiftKey || e.altKey)) || 
(key >= 96 && key <= 105) 
)) e.preventDefault(); 
}); 
}}); 
</script>