- Not a text field and copying value from the existing integer field and hiding the original one.
- Not changed the personalization setting to change the number formatting for all integers.
- Created a simple web-resource with similar look and feel.
<html>
<head>
<script>
function setYearValue()
{
debugger;
document.getElementById('yearvalue').innerText =
window.parent.Xrm.Page.getAttribute('new_verificationexpireyear2').getValue();
document.getElementById('lockSymbol').src =
window.parent.Xrm.Page.context.getClientUrl() + "//WebResources/new_/image/locksymbol.png";
window.parent.Xrm.Page.getControl('new_verificationexpireyear2').setVisible(false);
}
</script>
</head>
<body onload="setYearValue();">
<div style="border-bottom:1px solid rgb(216,216,216); width:100%; margin-left:-12px; ">
<table>
<tr>
<td style="padding:0px 0px 10px 5px">
<img id="lockSymbol" />
</td>
<td style="padding:0px 85px 10px 5px">
<span class="ms-crm-InlineEditLabelText ms-crm-UnsetWhiteSpace"
id="new_verificationexpireyear_cl"
style="white-space: nowrap; margin: 0px; font-family: 'Segoe UI', Tahoma, Arial; font-size: 1rem; float: left; color: rgb(68,68,68);">
Expiry Year
</span>
</td>
<td style="padding:0px 80px 10px 5px">
<span id="yearvalue" style="margin: 0px; font-family: SegoeUI, 'Segoe UI', Tahoma, Arial; font-size: 1rem; opacity:1; color:rgb(51,51,51);">
</span>
</td>
</tr>
</table>
</div>
</body>
</html>
More Reference here
How to format a phone number in Dynamic 365 crm
How to validate mobile with country code in Dynamic CRM
