Support Article
Unable to limit the max number of characters on a text box
Summary
When trying to limit the maximum number of characters on a text box with the property it references in a list the page built does not include it on the input tag.
property-reference: Page.PageList(1).property with a limit on max characters does not show up on input tag generated
proeprty-reference: Page.property with a limit on max characters works as expected
Error Messages
Not Applicable.
Steps to Reproduce
1. Create a section with text inputs with a preference to a property.
2. Ensure that the property should be in a page list such that it is listed as .PageList(1).property.
3. Ensure that the presentation tab should be having a max number of characters on it.
4. Try to preview it and notice that the limit does not function as the input tag was not generated with the limit on it.
Root Cause
The max character limit does not work on a ‘number’ type input and this is a browser behavior.
Resolution
Perform the following local-change :
<script>
(function(){
document.addEventListener('DOMContentLoaded', function() {
var elearray=[];
elearray=document.querySelectorAll('input[type=number]');
for (var i = 0; i < elearray.length; ++i) {
elearray[i].addEventListener("input",function (event){
max_length=event.target.getAttribute("maxLength");
if(max_length!=null) { //to check if maxlength attribute is present
if (event.target.value.length>max_length) event.target.value = event.target.value.slice(0,max_length);
}
});
}
});
})();
</script>
However the user decided to change the property type to "Text" from "Number" and use this local change.
Published January 31, 2016 - Updated October 8, 2020
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.