Leaderboard

Hi Caspians I had a use case where we needed to enforce users entering only text in text input fields (no numbers/special characters allowed) Below is a solution that can be used for submission form/details DataPages. The code can be added to the header or footer: <script> if (document.addInputListener == undefined) { const txtInputNames = ['Txt1', 'Txt2'] const errorMessage = 'Please enter text only' const addInputListener = () => { txtInputNames.forEach(inputName => { document.querySelectorAll(`form[action*="[@cbAppKey]"] input#InsertRecord${inputName}, form[action*="[@cbAppKey]"] textarea#InsertRecord${inputName}, form[action*="[@cbAppKey]"] input#EditRecord${inputName}, form[action*="[@cbAppKey]"] textarea#EditRecord${inputName}`).forEach(HTMLInput=>{ HTMLInput.addEventListener('input', e=>{ e.target.value = e.target.value.replace(/\s{2,}/g, ' ') if (/^[A-Za-z\s]+$/.test(e.target.value)) { e.target.setCustomValidity('') return} e.target.setCustomValidity(errorMessage) e.target.value = e.target.value.replace(/[^A-Za-z\s]/g, '') e.target.reportValidity() }) }) }) } const DataPageReadyHandler = (e) => { if (e.detail.appKey != '[@cbAppKey]') { return } addInputListener() } document.addEventListener('DataPageReady', DataPageReadyHandler) document.addInputListener = 'Enabled' } </script> You would need to customize this array so it holds comma-separated names of your text fields where you need to enforce this solution: const txtInputNames = ['Txt1', 'Txt2'] Here you can customize the message that users will see when entering something other than text: const errorMessage = 'Please enter text only'